css学习——元素的显示方式

元素的显示方式有两个，一种是块级元素，如：div,p,h1等。一种是行内元素，如span。那么，为什么它们有的是块级元素占一行，有的是行内元素内容是多大就是多大呢?其实，他们这是有一个css属性决定的，这个属性就是display。

比如    display:block;        就是块的意思

display: inline;    是行的意思，

如果我们给div设置css样式为display:inline;那么，div就会像span一样变成行内元素，

同样如果给span设置display:block;    它就会变成div一样的块级元素。

我们知道，块级元素是可以设置宽高，但是要占一行，而行内元素是不能设置宽高的，有没有一种方法可以让一个元素既不占一行又可以设置宽高呢？

有的，这就是display的 inline-block属性，意思是既是块，又是行。