HTML的常见问题
2017-09-24 本文已影响0人
饥人谷_Coziz
HTML、XML、XHTML 有什么区别
- HTML：超文本标记语言（Hyper Text Mark-up Language），是为网页创建和其它可在网页浏览器中看到的信息设计的一种置标语言。HTML是一种语法较为松散的，不严格的Web语言。
- XML：可扩展标记语言（EXtensible Markup Language），使用一系列简单的标记描述数据，是一种简单的数据存储语言。
- XHTML：可扩展超文本标记语言（EXtensible HyperText Markup Language），是作为一种 XML 应用被重新定义的 HTML。XHTML有着严格的语法要求，本质上是一种从HTML向XML过度的技术。
怎样理解 HTML 语义化
HTML标签可以分为有语义的标签，和无语义的标签。比如table表示表格，form表示表单，a标签表示超链接，strong标签表强调。无语义标签典型的有<div>,<span>等。为了使HTML更易于阅读书写，尽量使用有一定语义的标签。
HTML语义化的好处：
- 在没有css时，也依然能够呈现很好的内容结构，代码结构。
- 提高用户体验，比如：title，alt用于解释名词和图片信息。
- 利于SEO，语义化能和搜索引擎建立良好的联系，有利于爬虫抓取更多的有效信息。
- 方便其他设备解析以语义的方式来渲染网页。
- 便于团队开发和维护，语义化更具可读性，减少差异化，利于规范化。
怎样理解内容与样式分离的原则
一个网页是由HTML、CSS以及JavaScript三部分组成的。写HTML的时候先不管样式，重点放在HTML的结构和语义化上，让HTML能体现页面结构或者内容之后再去写样。HTML内不允许出现属性样式，尽量不要出现行内样式。写JavaScript的时候，尽量不要用JS去直接操作样式，而是通过给元素添加删除class来控制样式变化。内容与样式分离的好处是，因为CSS文件都是导入链接的，是另一个文件，和HTML文件大小没关系，这样就使HTML文件的大小变小，能够更快的打开网页。
有哪些常见的meta标签
元数据（Metadata）是数据的数据信息。
<meta> 标签提供了 HTML 文档的元数据。元数据不会显示在客户端，但是会被浏览器解析。
META元素通常用于指定网页的描述，关键词，文件的最后修改时间，作者及其他元数据。
元数据可以被使用浏览器（如何显示内容或重新加载页面），搜索引擎（关键词），或其他 Web 服务调用。
| 属性 | 值 | 描述 |
|---|---|---|
| content | some_text | 定义与http-equiv或name属性相关的元信息 |
| charset | character_set | 声明页面所用的字符编码 |
| http-equiv | content-type / expire / refresh / set-cookie | 把content属性关联到HTTP头部 |
| name | author / description / keywords / generator / revised / others | 把 content 属性关联到一个名称 |
| scheme | format/URI | HTML5不支持。 定义用于翻译 content 属性值的格式 |
文档声明的作用?严格模式和混杂模式指什么?<!doctype html> 的作用?
- <!DOCTYPE> 声明位于文档中的最前面的位置，处于 <html> 标签之前。此标签可告知浏览器文档使用哪种 HTML 或 XHTML 规范。
- 严格模式和混杂模式是浏览器解析CSS时的两种模式。
严格模式：又称标准模式，是指浏览器按照 W3C 标准解析代码。
混杂模式：又称怪异模式或兼容模式，是指浏览器用自己的方式解析代码。
如何区分：浏览器解析时到底使用严格模式还是混杂模式，与网页中的 DTD 直接相关。- 如果文档包含严格的 DOCTYPE ，那么它一般以严格模式呈现。
- 包含过渡 DTD 和 URI 的 DOCTYPE ，也以严格模式呈现，但有过渡 DTD 而没有 URI会导致页面以混杂模式呈现。
- DOCTYPE 不存在或形式不正确会导致文档以混杂模式呈现。
- HTML5 没有 DTD ，因此也就没有严格模式与混杂模式的区别，HTML5 有相对宽松的语法，实现时，已经尽可能大的实现了向后兼容。
- <!doctype html>为HTML5的文档声明，使用HTML5来渲染页面。
浏览器乱码的原因是什么？如何解决
- 乱码产生的根本原因是保存的编码格式和浏览器解析时的解码格式不匹配导致的。
- 乱码一般是英文以外的字符才会出现。
解决的办法：清楚文件保存时的编码方式，然后在HTML的meta标签中charset设为相应的解码方式。
常见的浏览器有哪些，什么内核
Trident（IE内核）：Internet Explorer、国产的绝大部分浏览器
Gecko：Mozilla Firefox
Presto：Opera
WebKit：Safari、Chrome、国产的大部分双核浏览器其中一核就是WebKit
列出常见的标签，并简单介绍这些标签用在什么场景
| 标签 | 场景 |
|---|---|
| html | 网页以<html>开始，以</html>结束，最基本必需的标签 |
| head | 文档的头部，设置网页中不现实的信息，最基本必需的标签 |
| title | 定义文档的标题，它是 head 部分中唯一必需的元素 |
| meta | 位于文档的头部，不包含任何内容，提供有关页面的元信息 |
| body | 文档的身体，显示内容，最基本必需的标签 |
| h1~h6 | 不同的标题大小 |
| p | 段落标签，用于整段文字 |
| a | 超链接，用于从一张页面链接到另一张页面 |
| img | 展示一张图片 |
| div | 用于给页面划分区块，让结构更清晰 |
| span | 用来组合文档中的行内元素 |
| ul | 无序列表，用于表示并列的内容 |
| ol | 有序列表，表示带步骤或者编号的并列内容 |
| li | 列表项 |
| button | 按钮 |
| strong | 表示很重要，强调性强 |
| em | 表示强调一下 |
| ifram | 用于嵌入一个页面，需要注意跨域问题 |
| table | 用于展示表格 |
