HTML知识点（任务4）
2017-04-23 本文已影响0人
cheneyzhangch
HTML、XML、XHTML 有什么区别
都是标记语言：
- HTML： 超文本标记语言，是语法较为松散的、不严格的web语言；
- XML 可拓展标记语言，主要用于存储数据和结构；标签没有预定义，需自行定义标签；
- XHTML 可拓展超文本标记语言，基于XML，作用与HTML类似，但语法更为严格，例如区分大小写、标签需闭合等。
怎样理解 HTML 语义化
语义化HTML是一种编写html的方式，
是指在编写html的过程中通过选用合适的标签、使用合理的代码结构，是html代码结构更清晰，便于开发者在看不到页面只能看到代码的情况下进行更方便的阅读，同时让浏览器的爬虫和机器可以对html文件进行更好的解析。
怎样理解内容与样式分离的原则
写HTML的时候要专注于HTML的结构和语义化，让HTML能清晰的呈现页面内容或者结构，至于html内容的样式、字体大小、宽度、对齐方式等等则通过CSS进行控制，这样如果后期需要修改样式，可通过只修改CSS来实现，更加简单快捷
JS用来实现页面的交互和功能，写 JS 的时候，尽量不要用 JS 去直接操作样式，而是通过给元素添加删除class来控制样式变化。
html内不允许出现属性样式，尽量不要行内样式
有哪些常见的meta标签
| 标签 | 含义 |
|---|---|
| <mata charset="utf-8"> | 指定文档使用的字符编码 |
| <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"/> | 声明文档兼容模式，指示IE以目前可用的最高模式显示内容 |
| <meta name="keywords" content="your tags"> | 定义页面的关键词以便搜索引擎进行搜索 |
| 定义针对搜索引擎的关键词 | 页面描述，告诉搜索引擎你的站点的主要内容 |
| <meta name="author" content="你的姓名"> | 定义网页作者 |
| <meta name="revised" content="David, 2008/8/8/" /> | 定义页面的最新版本 |
| <meta http-equiv="refresh" content="5"/> | 5秒刷新一次页面 |
| <meta http-equiv="expires" content="Mon,12 May 2001 00:20:00 GMT"> | 用于设定网页的到期时间，一旦过期则必须到服务器上重新调用。需要注意的是必须使用GMT时间格式 |
| <meta http-equiv="pragma" content="no-cache"> | 禁用缓存 |
| <meta http-equiv="set-cookie" content="Mon, 12 May 2001 00:20:00 GMT"> | cookie设定，如果网页过期，存盘的cookie将被删除。需要注意的也必须使用GMT时间格式。 |
| <meta name="robots" content="index,follow" /> | 搜索引擎索引方式 |
文档声明的作用?严格模式和混杂模式指什么?<!doctype html> 的作用?
文档声明位于最前端，是为了告诉浏览器以什么类型的语言来解析文件
严格模式是浏览器根据文档声明<!doctype>的标准去解析页面。
混杂模式是指不加<!doctype>标签，允许浏览器自行选择解析渲染方式
<!doctype html>的作用是为了告诉浏览器以html的语言来解析网页
浏览器乱码的原因是什么？如何解决
浏览器乱码的根本原因
保存的编码格式和浏览器解析时的解码格式不匹配导致的
解决方法
在html页面编写中按照某一特定的编码格式进行书写，并在html中通过添加<meta charset="xxx">标签声明该html文件所采用的编码格式，以便浏览器采用同样的解码格式进行正确的编译
常见的浏览器有哪些，什么内核
| 浏览器 | 内核 |
|---|---|
| IE | Trident（又称IE内核） |
| FireFox | Gecko |
| Opera | Presto |
| Safari & Chrome | Webkit |
列出常见的标签，并简单介绍这些标签用在什么场景
| 标签 | 场景 |
|---|---|
| <html></html> | 包含HTML文件的所有内容 |
| <head></head> | 文档头部，是所有头部元素的容器 |
| <title></title> | 网页的名称 |
| <meta></meta> | META标签用来描述一个HTML网页文档的属性 |
| <body></body> | 网页呈现给用户的内容 |
| <head></head> | 文档头部，是所有头部元素的容器 |
| h1 /h1 | 一级标题，h1h6分别对应一级六级标题，逐级减小 |
| img src="xxx.jpg" alt="图片替代文案" | 插入图片 |
| ul /ul | 无序列表，直接接li |
| ol /ol | 无序列表，直接接li |
| br | 换行 |
| 横线 | |
| <div></div> | 分块 |
| p /p | 分块 |
| <span></span> | 行内元素的强调，语气很轻 |
| em /em | 行内元素的强调，语气适中 |
| strong /strong | 行内元素的强调，语气很强 |
| <a target="_blank" href="http://www.baidu.com/">百度</a> | 超链接， 新建标签页跳转，显示名为“百度” |
| <a target="_self" href="http://www.baidu.com/">百度</a> | 超链接， 在本标签页跳转，显示名为“百度” |
| <button>按钮</button> | 添加按钮 |
