udpate
This commit is contained in:
qianguyihao
parent
ade4c77601
commit
02b3db2b64
@ -292,7 +292,7 @@ HTML中所有的**文字之间**，如果有空格、换行、tab都将被折叠
|
||||
|
||||
|
||||
|
||||
## 三、HTML的各种标签
|
||||
## 三、HTML结构详解
|
||||
|
||||
> 备注：
|
||||
> - 所有的浏览器默认情况下都会忽略空格和空行
|
||||
@ -440,7 +440,7 @@ HTML5中极大的简化了DTD，也就是说HTML5中就没有XHTML了（W3C自
|
||||
我们接下来对各个头标签进行介绍。
|
||||
|
||||
|
||||
#### 字符集 charset
|
||||
#### （1）字符集 charset
|
||||
|
||||
我们发现，在头标签中，有下面这种标签：
|
||||
|
||||
@ -456,7 +456,7 @@ charset就是charactor set（即“字符集”），这里采用的是。这个
|
||||
浏览器就是通过meta来看网页是什么字符集的。比如你保存的时候，meta写的和声明的不匹配，那么浏览器就是乱码。
|
||||
|
||||
|
||||
#### 定义“关键词”
|
||||
#### （2）定义“关键词”
|
||||
|
||||
举例如下：
|
||||
|
||||
@ -467,7 +467,7 @@ charset就是charactor set（即“字符集”），这里采用的是。这个
|
||||
这些关键词，就是告诉搜索引擎，这个网页是干嘛的，能够提高搜索命中率。让别人能够找到你，搜索到你。
|
||||
|
||||
|
||||
#### 定义“页面描述”
|
||||
#### （3）定义“页面描述”
|
||||
|
||||
meta除了可以设置字符集，还可以设置关键字和页面描述。
|
||||
|
||||
@ -495,7 +495,7 @@ name即“名字”，content即“内容”。
|
||||
|
||||
|
||||
|
||||
#### title标签
|
||||
#### （4）title标签
|
||||
|
||||
```html
|
||||
<title>网页的标题</title>
|
||||
@ -504,7 +504,7 @@ name即“名字”，content即“内容”。
|
||||
title也是有助于SEO搜索引擎优化的。
|
||||
|
||||
|
||||
#### html的完整骨架
|
||||
#### html的完整骨架：
|
||||
|
||||
综上所述，html的比较完整的骨架是这样：
|
||||
|
||||
@ -553,10 +553,10 @@ title也是有助于SEO搜索引擎优化的。
|
||||
|
||||
|
||||
|
||||
接下来，我们讲一下`<body>`里的各种标签的属性。
|
||||
|
||||
|
||||
|
||||
## 2、排版标签
|
||||
## 一、排版标签
|
||||
|
||||
### 注释标签
|
||||
|
||||
@ -586,9 +586,11 @@ title也是有助于SEO搜索引擎优化的。
|
||||
|
||||
HTML标签是分等级的，HTML将所有的标签分为两种：
|
||||
|
||||
- **容器级**：容器级别的标签，里面可以放置任何东西。
|
||||
- **文本级标签**：p、span、a、b、i、u、em。文本级标签里只能放**文字、图片、表单元素**。
|
||||
|
||||
- **容器级标签**：div、h系列、li、dt、dd。容器级标签里可以放置任何东西。
|
||||
|
||||
|
||||
- **文本级**：文本级的标签里面，只能放置文字、图片、表单元素。
|
||||
|
||||
从学习p的第一天开始，就要死死记住：**p标签是一个文本级标签，p里面只能放文字、图片、表单元素**。其他的一律不能放。
|
||||
|
||||
@ -620,20 +622,22 @@ PS：Chrome浏览器是世界上HTML5支持最好的浏览器。提供了非常
|
||||
|
||||
>CSS课程中你将知道，这两个东西，都是最最重要的“盒子”。
|
||||
|
||||
div：把标签中的额内容作为一个块儿来对待(division)。必须单独占据一行。
|
||||
div：把标签中的内容作为一个块儿来对待(division)。必须单独占据一行。
|
||||
|
||||
div标签的属性：
|
||||
- `align="属性值"`：设置块儿的位置。属性值可选择：left right center。
|
||||
- `align="属性值"`：设置块儿的位置。属性值可选择：left、right、 center。
|
||||
|
||||
<br>
|
||||
|
||||
`<span>`和`<div>`唯一的区别在于：`<span>`是不换行的，而`<div>`是换行的。如果单独在网页中插入这两个元素，不会对页面产生任何的影响。这两个元素是专门为定义CSS样式而生的或者说，DIV+CSS来实现各种样式。。
|
||||
**`<span>`和`<div>`唯一的区别在于**：`<span>`是不换行的，而`<div>`是换行的。
|
||||
|
||||
如果单独在网页中插入这两个元素，不会对页面产生任何的影响。这两个元素是专门为定义CSS样式而生的。或者说，DIV+CSS来实现各种样式。
|
||||
|
||||
效果举例：
|
||||
|
||||
|
||||
|
||||
div在浏览器中，默认是不会增加任何的效果改变的，但是语义变了，div中的所有元素是一个小区域。
|
||||
div在浏览器中，默认是不会增加任何的效果的，但是语义变了，div中的所有元素是一个小区域。
|
||||
div标签是一个**容器级**标签，里面什么都能放，甚至可以放div自己。
|
||||
|
||||
span也是表达“小区域、小跨度”的标签，但是是一个**文本级**的标签。
|
||||
@ -687,7 +691,8 @@ This <br> is a para<br>graph with line breaks
|
||||
|
||||
|
||||
|
||||
上图可以看到，`<p>`标签和`<br>`标签的区别在于：`<p>`标签会在段落的前后自动插入一个空行，而`<br>`标签没有空行；而且`<br>`标签没有属性。
|
||||
上图显示，**`<p>`标签和`<br>`标签的区别在于**：`<p>`标签会在段落的前后自动插入一个空行，而`<br>`标签没有空行；而且`<br>`标签没有属性。
|
||||
|
||||
注意`<br>` 没有结束标签，把`<br>`标签写为 `<br/>` 是经得起未来考验的做法，XHTML 和 XML 都接受在打开的标签内部来关闭标签的做法。
|
||||
|
||||
<br>
|
||||
@ -739,7 +744,7 @@ This <br> is a para<br>graph with line breaks
|
||||
|
||||
|
||||
|
||||
## 3、字体标签
|
||||
## 二、字体标签
|
||||
|
||||
### 标题
|
||||
|
||||
@ -854,7 +859,7 @@ O<sup>2</sup> 5<sub>3</sub>
|
||||
|
||||
|
||||
|
||||
## 4、超链接
|
||||
## 三、超链接
|
||||
|
||||
超链接有三种形式：
|
||||
|
||||
@ -979,7 +984,7 @@ blank就是“空白”的意思，就表示新建一个空白窗口。为啥有
|
||||
a的语义要小于p，a就是可以当做文本来处理，所以p里面相当于放的就是纯文字。
|
||||
|
||||
|
||||
## 5、图片标签
|
||||
## 四、图片标签
|
||||
|
||||
img: 代表的就是一张图片。是单边标记。
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user