display属性值block，inline和inline-block简单介绍

本章节简单介绍一下display三个重要的属性值的主特点，需要的朋友可以做一下参考。

一.block属性值:

当元素的display属性值为block的时候，说明此元素为块级元素，此种类型元素具有如下特点:

（1）.元素会独占一行，多个block元素会各自新起一行。默认情况下，元素宽度自动填满其父元素宽度。

（2）.元素可以设置width,height属性。

（3）.元素可以设置margin和padding属性。

二.inline属性值:

当元素的display属性值为block的时候，说明此元素为内联元素，此种类型元素具有如下特点:

（1）.元素不会独占一行，相邻的行内元素会排列在同一行里，直到排列不下，才会新换一行。

（2）.元素宽度随元素的内容而变化。

（3）.元素设置width,height属性无效。

（4）.元素的margin和padding属性，水平方向的padding-left, padding-right, margin-left, margin-right都产生边距效果；但竖直方向的padding-top, padding-bottom, margin-top, margin-bottom边距效果会产生异常。

三.inline-block属性值:

当元素的display属性值为inline-block的时候，说明此元素为内联块级元素。

所谓内联块级元素，也就是兼具内联元素和块级元素的特点，主要特点如下:

（1）.能够设置元素的width和height值。

（2）.默认情况下，宽度不会填充父元素的宽度。

（3）.能够在同一行排列。

（4）.能够设置内外边距。