理解HTML中的塊級元素和內聯元素

2021-07-31 13:56:27 字數 626 閱讀 5893

元素的型別是根據文件型別定義(dtd)來指明的,

元素型別的區分是為了對頁面布局可以更準確的調整。

1.塊級元素(block)

特性:

常見的塊級元素:div、form、h1-6、p、ul、table

2.內聯元素(inline)

特性:

常見的內聯元素:a、em、span、select、img、input

3..css中的應用

display屬性用於定義建立布局時元素生成的顯示框型別。

display: block,將元素顯示為塊級元素

display: inline,將元素顯示為內聯元素

display:inline-block,將元素轉為內聯元素,但是元素的內容仍然擁有塊元素的特性。

多個內聯元素會自動排成一行,比如img標籤或span標籤插到一行文字中,他會和這行文字自動排成一行,而如果你在這行文字中插入乙個塊元素標籤,比如div標籤,那麼這個div標籤會自己獨佔一行。

4.可變元素

可變元素為根據上下文語境決定該元素為塊元素或內聯元素。

HTML中的塊級元素和內聯元素

塊級元素 block level element 總是獨佔一行,表現為另起一行開始,而且其後的元素也必須另起一行顯示 寬度 width 高度 height 內邊距 padding 和外邊距 margin 都可控制 寬度沒有設定時,預設為100 可以包含某些塊級元素和內聯元素 內聯元素 inline ...

html塊級元素和內聯元素

塊級元素 就是乙個方塊,像段落一樣,預設佔據一行出現 內聯元素 又叫行內元素,顧名思義,只能放在行內,就像乙個單詞,不會造成前後換行,起輔助作用。一般的塊級元素諸如段落 標題.列表,body 元素的內容會顯示在瀏覽器中。title 元素的內容會顯示在瀏覽器的標題欄中。從上圖的例子可以看出,塊級元素預...

html的塊級 內聯 內聯塊級元素基礎

概念 塊級 block 內聯 inline 內聯塊級 inline block 在html元素中,元素會有display屬性 display屬性預設值是block,那麼該元素是塊級元素。display屬性預設值是inline,那麼該元素是內聯元素。沒有元素的display預設值是inline blo...