html5中的几种常见标签

日子一天接一天的飞快流逝，每天能学到一点新的东西，也是件令人开心的事吧！

1.块与行

display:显示

2.块级标签的特点：

1.独占一行

2.可以设置尺寸

3.没有明确宽度的时候，宽度由父级决定

4.没有明确高度的时候，高度由内容决定

5.支持margin,padding

3.行级标签的特点：

1.不会独占一行，可以与其他行级元素并排

2.不支持尺寸设置

3.对margin左右，padding左右支持较好，上下间距慎用(谨记)

4.display:inline-block;行快级标签特点

1.支持盒模型，但不会独占一行

5.盒模型

盒模型分为标准盒模型和怪异盒模型

盒模型有：margin padding border内容尺寸width/height

怪异盒模型：padding和border不影响盒子的内容：box-sizing :border-box;

标准盒模型内容尺寸盒子尺寸区域尺寸

盒子和盒子之间用margin，盒子内部用padding,盒子尺寸用auto

6.三种样式：

(1)行间样式的优缺点：

1.优点：不会额外的产生请求

2.缺点：容易产生重复的代码，造成文档体积变大

不利于维护

不符合结构与样式分离的规范

综上所述：不建议使用行间样式

(2)内部样式的优缺点

1.优点：不会产生额外的请求

初步实现结构与样式的分离

2.缺点：代码复用不方便

适合单页面网站应用

(3) 外部样式表的优缺点：

1.优点：利于后期维护

可以重复使用

完成实现结构与样式的分离

2.缺点：会产生额外的请求（但是后期我们会借助工具抹平这个缺点）

7.标签名选择器：作用于一类选择器，方式是通过标签名称，使得样式重置

8.群组选择器：选择器1，选择器2，。。。用于优化代码，，减少文档体积

9.类选择器：

10. class命名规范

1.不要以数字开头

2.尽量取的有意义

3.多个单词建议使用_连接