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

2021-08-20 16:04:55 字數 472 閱讀 6082

最主要的區別是:

內聯不占行,如input,span,a,你會發現寫多個input的時候,它們都排在同一行

塊狀元素,占行,如div,p。你會發現寫多個div的時候,它們都各自佔一行。

有時候你用到什麼元素的時候,可能自己觀察下。也可以去看下w3school。

如果你想內聯元素占行,可以用css中的display:block;

直接轉換即可,如下 :

塊變內聯

內聯變塊

內聯元素(inline element)一般都是基於語義級(semantic)的基本元素。內聯元素只能容納文字或者其他內聯元素,常見內聯元素"a"。

塊元素(block element)和內聯元素(inline element)都是html規範中的概念。塊元素和內聯元素的基本差異是塊元素一般都從新行開始。而當加入了css控制以後,塊元素和內聯元素的這種屬性差異就不成為差異了。

html塊級元素和內聯元素

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

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

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

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

元素的型別是根據文件型別定義 dtd 來指明的,元素型別的區分是為了對頁面布局可以更準確的調整。1.塊級元素 block 特性 常見的塊級元素 div form h1 6 p ul table 2.內聯元素 inline 特性 常見的內聯元素 a em span select img input 3...