HTML、XML、XHTML 有什么区别?
- 三者发展先后HTML>XML>XHTML
- HTML:HyperText Markup Language / 超文本标记语言
- XML: Extensible Markup Language / 可扩展标记语言
- XHTML: Extensible Hypertext Markup Language / 可扩展超文本标记语
HTML
- 所谓超文本,就是说它除了能标记文本,还能标记其他的内容,比如:图片,链接,音频,视频等。
- HTML里面的标签都是预设的,不能自定义标签,语法比较松散,大小写可以混用,属性值随便你加不加引号,单引号还是双引号也随便你,标签不闭合也能运行。
XML
- 它的表现形式就是给一个文档加一堆标签,说明每段文字是干什么的,有什么意义。方便存储、传输、分享数据,人和机器都可以很方便的阅读。
- 语法严格有开有闭!
XHTML
- 是HTML与XML的结合体,也可以理解为HTML除了预设的标签,也能添加自定的标签了。而且语法变得严格。
如:
1.对非空元素,必须使用结束标签。
2.元素和属性名必须小写。
3.属性值必须在引号中。
4.属性-属性值必须完整成对的写出。像checked这样的属性名不能在不指定属性值的情况下出现。
5.空元素必须有结束标签,或者起始标签必须以/>结束。如:<br/>或<hr></hr>。
怎样理解 HTML 语义化?
- 根据内容的结构(内容语义化),选择合适的标签便于开发者阅读和* 出更优雅的代码的同时让浏览器的爬虫和机器很好地解析。
- 语义化的含义就是用正确的标签做正确的事情,html语义化就是让页面的内容结构化,便于对浏览器、搜索引擎解析;在没有样式CCS情况下也以一种文档格式显示,并且是容易阅读的。使阅读源代码的人对网站更容易将网站分块,便于阅读维护理解。
举例说明,按钮用<button> ,输入框搜索框用<input>,字体加粗直接用标签,<b></b>/<strong></strong>,字体倾斜用<i></i>,一级标题用<h1> 二级标题用<h2>,以此类推,这就是语义化
怎样理解内容与样式分离的原则?
我们先看一下下面两个例子
- <p style="color: red"></p>
<p style="color: red"></p>
<p style="color: red"></p>
这是分离前的。
.html文件
<p>段落1</p>
<p>段落2</p>
<p>段落3</p>
.css文件
p{color:red;}
p
这是分离后的。
有没有发现代码结构精简,而且复用性变高,而且如果以后要改外观不用再HTML里面一个个的换样式,而是直接写CSS覆盖。
有哪些常见的meta标签?
-
chaset:
申明编码。
-
name:
常用的选项有keywords(关键字) ,description(网站内容描述),author(作者),robots(机器人向导)等。
-
http-equiv:
可用于代替name项,常用的选项有Expires(期限),Pragma(cache模式),Refresh(刷新),Set-Cookie(cookie设定),Window-target(显示窗口的设定),content-Type(显示字符集的设定)等。
-
content:
根据name项或http-equiv项的定义来决定此项填写什么样的字符串。
文档声明的作用?严格模式和混杂模式指什么?<!doctype html> 的作用?
- 文档声明作用:为了告诉浏览器该文件的类型。让浏览器解析器知道应该用哪个规范来解析文档。必须在 HTML 文档的第一行,这并不是一个 HTML 标签。
- 严格模式:又称标准模式,是指浏览器按照 W3C 标准解析代码。
- 混杂模式:又称怪异模式或兼容模式,是指浏览器用自己的方式解析代码。
- <!DOCTYPE html> 告诉浏览器,以HTML5的方式解析、渲染当前页面。
浏览器乱码的原因是什么?如何解决?
浏览器打开页面时,将编码和字符串解析成内容;若无指明编码格式,浏览器不知道以何种方式来解析编码,以浏览器默认的编码方式进行解析,所以容易造成乱码。常见有中文字符、小语种字符错误。
解决方式:设置在meta里面charset=“UTF-8”;
常见的浏览器有哪些,什么内核?
浏览器 | 内核 |
---|---|
IE | Trident |
Chrome | Blink |
firefox | Gecko |
Safari | Webkit |
Opera | Presto |
列出常见的标签,并简单介绍这些标签用在什么场景?
- h1-h6 标题1~6从大到小
- p 段落
- a 链接到一个地方可以使锚点可以使网页
- img 展示图片
- div标签,用于给页面划分区块,让结构更清晰
- ul li 无序列表,可以嵌套ul的直接子元素是li,里面不可以有p,h等标签
- ol li 有序列表
- dl dt dd 用于展示一系列“标题:内容....”的场景
- <button> </button>按钮
- iframe 用于嵌入一个页面,需要注意跨域操作问题
- table 用于展示表格,tr为行,td为列