3.CSS-显示模式

1.div和span的区别

（1）div单独占一行，div常用于网页布局；span不独占一行，常用于修改局部信息。

（2）div是一个容器级标签，span是一个文本级标签。容器级标签可以嵌套其他所有标签，文本级标签只能嵌套文字、图片、超链接。常见的容器级标签有：div、h、ul、ol、dl、li、dt、dd；常见的文本级标签有：span、p、buis、strong、em、ins、del

2.css元素显示模式

html中，将所有标签分为两类，分别是容器级的和文本级的。在css中，将所有标签分为两类，分别是块级元素和行内元素。块级元素会独占一行，行内元素不会独占一行。所有的容器标签的都是块级元素，文本标签除了p标签其他都是行内元素，p标签是块级元素。

块级元素和行内元素的区别：（1）块级元素独占一行，如果没有设置宽度，那么默认和父元素一样宽，如果设置了宽高，那就按设置的来显示，块级元素可以设置margin值。（2）行内元素不独占一行，如果没有设置宽度，那么默认宽度和内容一样宽，并且行内元素不可以设置宽度和高度，行内元素不可以设置margin-top和margin-bottom值，但是可以设置margin-left和margin-right值。（3）inline-block不独占一行，可以设置宽高，可以设置margin值。

现在有个需求是：不独占一行，但是呢却可以设置宽度和高度，为之奈何？那就是行内块级元素，比如img标签就是行内块级元素，它即可以不独占一行，又可以设置宽度和高度。故css将标签分为三类：块级元素、行内元素、行内块级元素。