美文网首页我爱编程
关于HTML的一些问题和理解

关于HTML的一些问题和理解

作者: 饥人谷_akira | 来源:发表于2017-04-18 14:31 被阅读0次

HTML、XML、XHTML 有什么区别?

1 、HTML(HyperText Mark-up Language)即[超文本标记语言]或超文本链接标示语言,是目前网络上应用最为广泛的语言,也是构成网页文档的主要语言。HTML文本是由HTML命令组成的描述性文本,HTML命令可以说明文字、图形、动画、声音、表格、链接等。HTML的结构包括头部(Head)、主体(Body)两大部分,其中头部描述浏览器所需的信息,而主体则包含所要说明的具体内容。有以下特点:

  • 对大小写不敏感
  • 标签不必成对出现

2 、XHTML是一个基于XML的置标语言,看起来与HTML有些相象,只有一些小的但重要的区别,XHTML就是一个扮演着类似HTML的角色的XML,所以,本质上说,XHTML是一个过渡技术,结合了部分XML的强大功能及大多数HTML的简单特性。
特点:

  • 对大小写敏感,必须是小写的;
  • 标签必须成对出现,有开始标签就必须有结束标签;
  • 属性值必须在引号之内;
  • 不支持属性最小化:
  • eg:正确:<input checked='checked'>
    -错误:<input checked>
    -name属性不赞成使用,以后会被淘汰;
  • 空元素也要结束标签:如:
    ,
    (水平分割线)

3 、XML是用户创建特定语言如HTML的一种通用语言。它是指XML提供一种基本结构以及标记语言必须遵守的一组规则。使用XML可以创建一种独特的标记语言来描述任何一种信息,包括网页。XML提供了基础规则,以统一的方式来组织信息。XML并不是HTML的代替品,HTML是相对不那么结构话的语言,它可以从XML的规则得到改进。这两种技术的自然结合,使HTML遵守XML的规则和结构。为实现这种结合,出现了一种新版的HTML,即XHTML。html最终会发展到xml,xhtml是html想xml发展的一个过渡,xhtml的特性也适合xml;

怎样理解 HTML 语义化?

语义化 HTML 就是选择合适的标签、使用合理的代码结构来编写HTML的方式,使代码更具可读性,也使得浏览器的爬虫和机器能对代码更好地解析。
要实现HTML的语义化,就要求开发者掌握常用的HTML标签,理解各种标签所代表的含义,在不同的场景能使用合适的标签,尽量不使用没有语义信息的标签。
语义化带来的是更清晰的页面结构,使页面可读性更强;更清晰的代码结构,更利于开发团队的开发和维护;更好的适应性,可以支持更多的设备的不同表现形式;与机器更良好的沟通,使浏览器更容易渲染表现,也使搜索引擎更容易获取有效信息。

怎样理解内容与样式分离的原则?

一个符合理想状态下的网页代码,应该分成三部分:.html文件,.css文件,.js文件。html标签只负责承担内容,样式交给css,javascript负责行为。假如不能将css设做独立文件外链出去,则应该在html页面中使用<style>或者<script>标签承载内容,而不是用<table>设计布局。这样做有以下几个优点:  
1 、使页面载入得更快。由于将大部分页面代码写在了CSS当中,使得页面体积容量变得更小。相对于表格嵌套的方式的逐层加载速度快。  
2 、 修改设计时更有效率在修改页面的时候更加容易省时。根据区域内容标记,到CSS里找到相应的ID,使得修改页面的时候更加方便,也不会破坏页面其他部分的布局样式。而表格布局则更不省事。  
3 、保持视觉的一致性DIV+CSS最重要的优势之一:保持视觉的一致性;以往表格嵌套的制作方法,会使得页面与页面,或者区域与区域之间的显示效果会有偏差。  
4 、更好地被搜索引擎收录。由于将大部分的HTML代码和内容样式写入了CSS文件中,这就使得网页中代码更加适合搜索引擎。  
5 、对浏览者和浏览器更具亲和力。对浏览者和浏览器更具亲和力,由于CSS富含丰富的样式,使页面更加灵活性,更加的美观,它可以根据不同的浏览器,而达到显示效果的统一和不变形。

有哪些常见的meta标签?

META标签可分为两大部分:HTTP-EQUIV和NAME变量。
页面关键词
  <meta name="keywords" content="your tags" />

页面描述
  <meta name="description" content="150 words" />

搜索引擎索引方式
  <meta name="robots" content="index,follow" />
  

页面重定向和刷新
  <meta http-equiv="refresh" content="0;url=" />

其他
  <meta name="author" content="author name" />
  <meta name="google" content="index,follow" />
  <meta name="googlebot" content="index,follow" />
  <meta name="verify" content="index,follow" />

移动设备
  <meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0, user-scalable=no"/>
  

WebApp全屏模式
  <meta name="apple-mobile-web-app-capable" content="yes" />

隐藏状态栏/设置状态栏颜色
  <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />

添加到主屏后的标题
  <meta name="apple-mobile-web-app-title" content="标题">

忽略数字自动识别为电话号码
  <meta content="telephone=no" name="format-detection" />

忽略识别邮箱
  <meta content="email=no" name="format-detection" />

申明编码
  <meta charset='utf-8' />

优先使用 IE 最新版本和 Chrome
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
  
  <meta http-equiv="X-UA-Compatible" content="IE=6" >
  <meta http-equiv="X-UA-Compatible" content="IE=7" >
  <meta http-equiv="X-UA-Compatible" content="IE=8" >

禁止浏览器从本地计算机的缓存中访问页面内容
  <meta http-equiv="Pragma" content="no-cache">
浏览器不会自动调整文件的大小,也就是说是固定大小,不会随着浏览器拉伸缩放。
<meta name="MobileOptimized" content="240"/>

文档声明的作用?严格模式和混杂模式指什么?<!doctype html> 的作用?

  • 文档声明用来说明web设计中所用的html或xhtml的类型,指出浏览器或者其他阅读程序按照什么样的规则(W3C所发布的一个文档类型定义即DTD)集去解释文档中的标记。

  • 严格模式是浏览器根据web标准去解析页面,是一种要求严格的DTD,不允许使用任何表现层的语法,如

  • 混杂模式则是一种向后兼容的解析方法,说的透明点就是可以实现IE5.5以下版本浏览器的渲染模式。

  • <!doctype html>声明文档的解析类型为html,避免浏览器的怪异模式。

浏览器乱码的原因是什么?如何解决

浏览器本身选择的编码模式与需要解码的文件本身的编码模式不一致,就会造成浏览器的乱码,解决方法:改变浏览器的编码,点击编码后,选择与文件相一致的编码,一般中文乱码选择uft-8就可解决。英文的乱码情况相对较少。

常见的浏览器有哪些,什么内核

1 使用Trident的是internet explorer,国产的绝大部分浏览器。Trident是就是ie内核  
2 使用Gecko的是Mozilla Firefox,使用 Gecko 内核的浏览器也有不少,如 Netscape MozillaSuite/SeaMonkey 等  
3 使用Presto的是opera,这是目前公认网页浏览速度最快的浏览器内核  
4 使用WebKit的有苹果的safari,谷歌的chrome,还有国产的大部分双核浏览器其中一核就是WebKit

列出常见的标签,并简单介绍这些标签用在什么场景

相关文章

  • 关于HTML的一些问题和理解

    HTML、XML、XHTML 有什么区别? 1 、HTML(HyperText Mark-up Language...

  • 前端面试问题集锦

    HTML部分 对HTML5的理解 html5一些问题manifest的部分被MDN标...

  • 前端面试知识点

    前端基础知识 1、关于html 1、html语义化标签得理解、结构化的理解;能否写出简洁的html结构;SEO优化...

  • Summary

    基本功考察 1.关于Html 1、html语义化标签的理解、结构化的理解;能否写出简洁的html结构;SEO优化。...

  • 前端知识点目录整理

    基本功考察 关于Html 1、html语义化标签的理解、结构化的理解;能否写出简洁的html结构;SEO优化。 2...

  • HTML-语义化-(iframe-a-form的使用)

    语义化 参考资料:semantic-html 关于语义化 HTML 以及前端架构的一点思考 如何理解 web ...

  • 你觉得幸福是什么呢

    关于幸福,每个人都有自己的想法和理解,现在我们社会正在高速发展,在这高速发展中也带来一些问题,我想其中...

  • 20201118-融合基因

    关于基本概念的理解:https://www.cnblogs.com/aipufu/p/11615336.html[...

  • 关于HTML中盒模型的理解

    一提及到HTML,大家都能想到盒模型。但是又有多少人完全理解它了?以下是我对于盒模型的理解: 1.盒模型本质是一个...

  • HTML基础 关于代码最初的理解

    第一节 浏览器知识 什么是浏览器 浏览器是网页运行的平台,常用的浏览器有IE、360、火狐(Firefox)、谷歌...

网友评论

    本文标题:关于HTML的一些问题和理解

    本文链接:https://www.haomeiwen.com/subject/iewfzttx.html