HTML块元素与内联元素

HTML块元素和内联元素

【1】块元素在浏览器显示的时候，通常是会以新行来开始和结束。这样子的块级元素，会自动占据一定的行空间，因此它是可以控制来设置高度，宽度，内外边距等的属性。

但是内联元素则是不一样，它没有自己独立的空间，于相邻的元素在同一行，它不会自动去占据一行的空间，而且经常是依附于块级元素存在，所以一般来说，高度，宽度，内外边距等它都是没有效的。

【2】但是如果我们给任意的一个元素加入float这个属性，那么不管他们是不是块级元素，还是内联元素，他们都可以排成一行，如果空间允许的情况下。并且可以设置高度或者宽度等。

【3】实际上块级元素和内联元素是可以通过属性display来设置的，display: block;则代表的是该元素可以成为块级元素，即使它之前是内联元素，但是通过这个属性设置过后，它就相当于块级元素了，就可以设置高度和宽度等。

但是本来的内联元素就不能成为一行了，而是分行显示。

【4】同时还有一个display: inline-block样式---显示为内联块级元素，表示的是成为同一行，但是确实块级元素，可以控制高度，宽度和内外边距等属性。