Update

2017-06-30 09:01:48 +08:00 · 2017-06-30 09:01:48 +08:00 · 62afd11b51
commit 62afd11b51
parent 1b3648759e
1 changed files with 95 additions and 0 deletions
--- a/01-html/01-html标签.md
+++ b/01-html/01-html标签.md
@ -195,6 +195,37 @@ body部分：我们所写的代码必须放在此标签內。

 目前，IE浏览器是完全不支持H5的，支持最好的是Opera浏览器，可以支持95%以上；其次是google，可以支持一部分H5。

+### HTML的基本语法特性
+
+#### 1、HTML对换行不敏感，对tab不敏感
+
+HTML只在乎标签的嵌套结构，嵌套的关系。谁嵌套了谁，谁被谁嵌套了，和换行、tab无关。换不换行、tab不tab，都不影响页面的结构。
+
+也就是说，HTML不是依靠缩进来表示嵌套的，就是看标签的包裹关系。但是，我们发现有良好的缩进，代码更易读。要求大家都正确缩进标签。
+
+百度为了追求极致的显示速度，所以HTML标签都没有换行、都没有缩进（tab），HTML和换不换行无关，标签的层次依然清晰，只不过程序员不可读了。如下图所示：
+
+20170629_2226.jpg
+
+#### 2、空白折叠现象
+
+HTML中所有的文字之间，如果有空格、换行、tab都将被折叠为一个空格显示。
+
+举例如下：
+
+20170629_2230.jpg
+
+
+#### 3、标签要严格封闭
+
+标签不封闭是灾难性的。
+
+标签不封闭的举例如下：
+
+20170629_2244.jpg
+
+
+
 ## 三、HTML的各种标签

 > 备注：
@ -389,14 +420,78 @@ charset就是charactor set（即“字符集”）。这个meta不用背，用su



+### 关键字和页面描述


+我们把含有`meta`标签的这一行代码抽象一下：
+
+```html
+<meta name=" " content=" ">
+```
+
+name即“名字”，content即“内容”。
+
+#### 定义`页面描述`
+
+meta除了可以设置字符集，还可以设置关键字和页面描述。
+
+设置页面描述举例：
+
+```html
+<meta name="Description" content="网易是中国领先的互联网技术公司，为用户提供免费邮箱、游戏、搜索引擎服务，开设新闻、娱乐、体育等30多个内容频道，及博客、视频、论坛等互动交流，网聚人的力量。" />
+```
+
+只要设置的Description页面描述，那么百度搜索结果，就能够显示这些语句，这个技术叫做**SEO**（search engine optimization，搜索引擎优化）。
+
+如下图所示：
+
+20170629_1743.png


+#### 定义`关键词`
+
+举例如下：
+
+```html
+<meta name="Keywords" content="网易,邮箱,游戏,新闻,体育,娱乐,女性,亚运,论坛,短信" />
+```
+
+这些关键词，就是告诉搜索引擎，这个网页是干嘛的，能够提高搜索命中率。让别人能够找到你，搜索到你。


+### title标签
+
+```html
+		<title>网页的标题</title>
+```
+
+title也是有助于SEO搜索引擎优化的。


+### html的完整骨架
+
+综上所述，html的比较完整的骨架是这样：
+
+```html
+	<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+	<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
+	<head>
+		<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
+		<meta name="Keywords" content="牛逼，很牛逼，特别牛逼" />
+		<meta name="Description" content="网易是中国领先的互联网技术公司，为用户提供免费邮箱、游戏、搜索引擎服务，开设新闻、娱乐、体育等30多个内容频道，及博客、视频、论坛等互动交流，网聚人的力量。" />
+		<title>Document</title>
+	</head>
+	<body>
+		
+	</body>
+	</html>
+```
+
+
+面试题；
+
+- 问：网页的head标签里面，表示的是页面的配置，有什么配置？
+- 答：字符集、关键词、页面描述、页面标题。（今后我们还能看见一些其他的配置：IE适配、视口、iPhone小图标等等）