HTML的塊狀內聯內聯塊狀元素的特點

元素分類及特點：

1.塊級元素：

在html中、、、、和就是塊級元素。設定display:block就是將元素顯示為塊級元素。塊級元素特點：

（1）、每個塊級元素都從新的一行開始，並且其後的元素也另起一行；（乙個塊級元素獨佔一行）

（2）、元素的高度、寬度、行高以及頂和底邊距都可設定；

（3）、元素寬度在不設定的情況下，是它本身父容器的100%（和父元素的寬度一致），除非設定乙個寬度。

2.內聯元素：

在html中，、、、、和就是典型的內聯元素（行內元素）（inline）元素。當然塊狀元素也可以通過**display:inline將元素設定為內聯元素。內聯元素特點：

（1）、和其他元素都在一行上；

（2）、元素的高度、寬度、行高及頂部和底部邊距不可設定；

（3）、元素的寬度就是它包含的文字或的寬度，不可改變。

注意：為 a 元素設定了寬和高，但都沒有起到作用，原因是a在預設的時候是內聯元素，內聯元素是不可以設定寬和高的。

3.內聯塊狀元素：

內聯塊狀元素（inline-block）就是同時具備內聯元素、塊狀元素的特點，**display:inline-block就是將元素設定為內聯塊狀元素。inline-block元素特點：

（1）、和其他元素都在一行上；

（2）、元素的高度、寬度、行高以及頂和底邊距都可設定。

注意：img是inline元素，但是他同時也是替換元素，他有著特殊的表現：

1.可以設定width/height;

2. 預設的，img元素在螢幕佔據的空間與其的實際畫素一致，除非css有設定或者自身的width/height html 屬性有設定；

3. 如果img標籤的包裹元素為也為inline元素，則img的邊界可以超出其直接父元素的邊界，直到自己的寬、高達到最大或者設定值為止，而且文件流中img的兄弟元素也不能遮蓋住img。最常見的就是裡面包含的

4. 所以從行為上看,img元素作為替換元素，有著類似於inline-block的行為，儘管在spec裡面，他的確是乙個inline元素。

元素分類及特點 1.塊級元素在html中和就是塊級元素。設定display block就是將元素顯示為塊級元素。塊級元素特點 1 每個塊級元素都從新的一行開始，並且其後的元素也另起一行乙個塊級元素獨佔一行 2 元素的高度寬度行高以及頂和底邊距都可設定 3 元素寬度在不設定的情況下，是它本...

HTML的塊狀 內聯 內聯塊狀元素的特點