Day2-h和p标签

四、h和p标签

4.1 h系列

<h1> 到 <h6> 都是标签：

<h1></h1> 一级标题

<h2></h2> 二级标题

……

<h6></h6> 六级标题

 

h标签没有嵌套关系的。由于h3跟着一个h2，所以，我们自己就知道了这个h3是h2子标题。

1                  <h1>今日学习内容</h1>

2                  <h2>一、复习上节课的内容</h2>

3                  <h2>二、HTML骨架</h2>

4                  <h3>2.1 文档声明头</h3>

5                  <h3>2.2 字符集</h3>

6                  <h3>2.3 关键字和页面描述</h3>

7                  <h3>2.4 title标签</h3>

8                  <h2>三、HTML的基本语法特性       </h2>

9                  <h3>3.1 HTML对换行不敏感，对tab不敏感</h3>

10              <h3>3.2 空白折叠现象</h3>

11              <h3>3.3 标签要严格封闭</h3>

12              <h2>四、h和p标签</h2>

13              <h3>4.1 h系列</h3>

h是容器级的标签。理论上里面可以放置p、ul，只是法律上的允许，在语义上，不要这么写。

4.2 p标签

段落，是英语paragraph“段落”缩写。

HTML标签是分等级的，HTML将所有的标签分为两种：容器级、文本级。

顾名思义，容器级的标签，里面可以放置任何东西；文本级的标签里面，只能放置文字、图片、表单元素。

 

p标签是一个文本级标签。从学习p的第一天开始，就要死死记住：p里面只能放文字、图片、表单元素。其他的一律不能放。

 

Chrome浏览器 是世界上HTML5支持最好的浏览器。提供了非常好的开发工具，非常适合我们开发人员使用。审查元素功能的快捷键是F12。

Chrome的英语原意“硅”，是谷歌公司的产品，所以也叫作谷歌浏览器。

 

 

审查元素功能：

 

 

试着把h放到p到里：

1                  <p>

2                         我是一个小段落

3                         <h1>我是一个主标题</h1>

4                  </p>

浏览器不允许你这么做，我们使用Chrome的F12审查，你会发现，浏览器自己把p封闭掉了，不让你去包裹h1。

 

所以，再次强调，p是一个文本级的标签，p里面只能放文字、图片、表单元素。

 

正确的：

1                  <h3>个人经历</h3>

2                  <p>

3                         Angelababy从小怎么怎么样

4                  </p>

错误的：

1                  <p>

2                         <h3>个人经历</h3>

3                         Angelababy从小怎么怎么样

4                  </p>