Block和inline元素對比

2022-09-02 02:03:10 字數 395 閱讀 7237

所有的html元素都屬於block和inline之一。

block元素的特點是:

總是在新行上開始;

高度,行高以及頂和底邊距都可控制;

寬度預設是它的容器的100%,除非設定乙個寬度

, , , , 和 是塊元素的例子。

和其他元素都在一行上;

高,行高及頂和底邊距不可改變;

寬度就是它的文字或的寬度,不可改變。

, , , ,

,和是inline元素的例子。

讓乙個inline元素從新行開始;

讓塊元素和其他元素保持在一行上;

控制inline元素的寬度(對導航條特別有用);

控制inline元素的高度;

無須設定寬度即可為乙個塊元素設定與文字同寬的背景色

塊狀(block)元素和內聯(inline)元素

行內 塊狀元素區別 1 塊級元素會獨佔一行,其寬度自動填滿其父元素寬度 行內元素不會獨佔一行,相鄰的行內元素會排列在同一行裡,直到一行排不下,才會換行,其寬度隨元素的內容而變化。2 一般情況下,塊級元素可以設定 width,height屬性,行內元素設定width,height無效。注意 塊級元素即...

block 塊元素 inline 內聯元素

我們首先要了解,所有的html元素,都要麼是block 塊元素 要麼是inline 內聯元素 下面了解一下block inline各自的特點 block元素的特點 總是在新行上開始 高度,行高以及頂和底邊距都可控制 寬度預設是它的容器的100 除非設定乙個寬度。塊元素 block element 一...

display的block和inline屬性

block元素特點 1.處於常規流中時,如果width沒有設定,會自動填充滿父容器 2.可以應用margin padding 3.在沒有設定高度的情況下會擴充套件高度以包含常規流中的子元素 4.處於常規流中時布局時在前後元素位置之間 獨佔乙個水平空間 5.忽略vertical align inlin...