HTML知识点
HTML、XML、XHTML 有什么区别？
HTML ： 超文本标记语言，是语法较为松散的、不严格的web语言；
XML : 可扩展标记语言，主要用于存储数据和结构；
XHTML : 可扩展超文本标记语言，基于XML，作用与HTML类似，但语法更加严格。
怎样理解HTML语义化
HTML是一种标记语言，HTML语义化，顾名思义，就是所写的HTML结构是使用相对应的有一定语义的字母（有英文语义的标签）来表示的。在没有CSS的情况下，文档内容结构依然完整。
语义化的目的：
- 在没有CSS代码使，依然能够很好的呈现内容结构和代码结构。
- 使用title alt 等用于解释的名词，提高用户体验。
- 便于屏幕阅读器、盲人阅读器等设备解析，以语义化方式渲染网页。
- 语义化具有更好的可读性，便于团队开发和维护。
为此，我们在写页面时，应注意以下事项
- 尽可能少的使用没有语义的div和span元素。
- 不使用纯样式标签，如b、font、u等，尽量使用CSS设置。
- 使用表格时，标题用caption，表头用thead，主体部分用tbody包围，尾部用tfoot包围。这样语义，结构明确。
怎样理解内容与样式分离的原则
内容与样式分离，即HTML负责内容，样式由CSS实现。
内容与样式分离具有以下优点：
- 由于将大部分页面代码写在了CSS当中，使得页面体积容量变得更小，页面载入得更快，提高用户体验。
- 在修改页面的时候更加容易省时。根据区域内容标记，到CSS里找到相应的ID，使得修改页面的时候更加方便，也不会破坏页面其他部分的布局样式。大大提高工作效率。
- 由于将大部分的HTML代码和内容样式写入了CSS文件中，这就使得网页中代码更加适合搜索引擎。因此在写代码时，应注意以下几点：
- 写 HTML 仅处理内容，只考虑 HTML 的结构和语义化，避免出现属性样式。
- 页面展现的所有样式，都由CSS来负责实现。
- 写 JS 的时候，尽量不使用 JS直接操作样式。
常见的meta标签有哪些
<meta> 元素可提供有关页面的元信息（meta-information），比如针对搜索引擎和更新频度的描述和关键词。
<meta> 标签位于文档的头部，不包含任何内容。<meta> 标签的属性定义了与文档相关联的名称/值对。
| 属性 | 值 | 描述 |
|---|---|---|
| context | some_text | 定义与 http-equiv 或 name 属性相关的元信息 |
| http-equiv | content-type 、expires 、refresh 、set-cookie | 把 content 属性关联到 HTTP 头部。 |
| name | some_text | 定义用于翻译 content 属性值的格式。 |
| charset | UTF-8、ISO-8859-1等 | 声明页面所用的字符编码 |
文档声明的作用?严格模式和混杂模式指什么?<!doctype html> 的作用?
- <!doctype>标签用来声明文档对象模型，用来告诉浏览器应该使用哪种方式来解析渲染页面。
- 严格模式就是使用<!doctype>标签来显式声明该用哪种方式来渲染页面，混杂模式即不加<!doctype>标签，允许浏览器使用自己的方式来渲染页面。
- <!doctype html>即就是声明使用HTML5来解析渲染页面
浏览器乱码的原因是什么？如何解决
常用的编码方式有：ASCII 、ISOLatin-1 、UNICODE 、UTF-8 、GBK 关于这几种编码的介绍可参考 聊一聊编码与乱码
而浏览器出现乱码一般是由于在制作页面时使用非英文字符时，保存的编码格式与浏览器解析时的解码格式不匹配。为了解决这个问题，就要在页面保存时就在HTML的<head>里添加<meta charset="">来声明编码格式，来告诉浏览器应该用什么解码格式来解码。
常见的浏览器有哪些，什么内核
常见浏览器有IE、 Chrome、Safari、opera、Firefox等。
-
Trident内核代表产品Internet Explorer，又称其为IE内核。Trident（又称为MSHTML），是微软开发的一种排版引擎。使用Trident渲染引擎的浏览器包括：IE、傲游、世界之窗浏览器、Avant、腾讯TT、Netscape 8、NetCaptor、Sleipnir、GOSURF、GreenBrowser和KKman等。
-
Gecko内核代表作品Mozilla Firefox，Gecko是一套开放源代码的、以C++编写的网页排版引擎。Gecko是最流行的排版引擎之一，仅次于Trident。使用它的最著名浏览器有Firefox、Netscape6至9。
-
WebKit内核代表作品Safari、Chrome ，webkit 是一个开源项目，包含了来自KDE项目和苹果公司的一些组件，主要用于Mac OS系统，它的特点在于源码结构清晰、渲染速度极快。缺点是对网页代码的兼容性不高，导致一些编写不标准的网页无法正常显示。主要代表作品有Safari和Google的浏览器Chrome。
-
Presto内核代表作品OperaPresto是由Opera Software开发的浏览器排版引擎，供Opera 7.0及以上使用。它取代了旧版Opera 4至6版本使用的Elektra排版引擎，包括加入动态功能，例如网页或其部分可随着DOM及Script语法的事件而重新排版。
列出常见的标签，并简单介绍这些标签用在什么场景
常见的HTML标签有哪些，并简单介绍这些标签用在什么场景
| 标签 | 使用场景 |
|---|---|
| <html>...</html> | 将所有HTML内容都包含在这个标签内 |
| <head>...</head> | 用于定义文档的头部，它是所有头部元素的容器。 |
| <title>...</title> | 文档的标题 |
| <meta>...</meta> | 提供有关页面的元信息 |
| <body>...</body> | 文档的内容 |
| <h1>...</h1> | 一级标题，h1h6分别对应六级标题，从16标题一次减小 |
| <p>...</p> | 整段文字 |
| <a>...</a> | 定义锚，即在页面插入链接 |
| <img> | 图片 |
| <ul>...</ul> | 无序列表 |
| <ol>...</ol> | 有序列表 |
| <li>...</li> | 列表项 |
| <br > | 换行 |
| <div>...</div> | 定义文档中的节，默认表现为块元素 |
| <span>...</span> | 定义定义文档中的节，默认表现为行内元素 |
| <em>...</em> | 定义强调文本 |
| <i>...</i> | 定义斜体字 |
| <strong>...</strong> | 定义强调文本 |
| <q>...</q> | 定义短引用 |
