html5中的几种常见标签

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

1.块与行

display:显示

display:block | inline | inline-block | none ;显示为块级元素|显示为行级元素|显示为行块级元素|不显示

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.多个单词建议使用_连接