css3 盒子类型

盒子的类型：使用display来定义

一、3种常见情况：block 、 inline、 inline-block

block 块级

inline 内联

inline-block 行内块

我们都知道：

一个块级元素占领一行，且可以设置宽高；

而一个内联元素后面可以跟内联元素，一行可以有很多个内联元素，但是内联元素设置不了宽高。

所以：

使用inline-block可以使块级元素在一行内（体现了inline的特性），并且可以给元素设置宽高（体现了block的特性）；

二、作用于table的inline-table;

inline-table和inline-block的使用方法和作用相同，只是inline-table特定作用于table元素的使用；

三、display = list-item列表

        使用display = list-item可以使用元素变成列表,效果和ul的li列表类似

         <style>

   div{

              display:list-item;

              list-style-type:circle;

  }

</style>

        <div>1</div>

<div>2</div>

<div>3</div>

<div>4</div>

这样就形成了一个列表。