塊屬性,行內屬性,行內塊屬性的特點與常見標籤

2022-09-10 12:33:11 字數 681 閱讀 2914

一、塊屬性:

特點:1.可以設定寬高

2.不可以與別人共處一行

3.不設定寬度的情況下,寬度為100%

常見標籤:div , p , ul , ol , li , button , h1-h6 , p等

二、行內屬性:

特點:1.不可以設定寬高

2.可以與別人共處一行

3.其寬高由內容撐開

常見標籤:span(空格的話,頁面會顯示空格,無論多少個空格,只顯示乙個空格) , a ,img , strong , br等

三、行內塊屬性:

特點:1.可以設定寬高

2.可以與別人共處一行

常見標籤:img , input等

四、各種標籤之間的轉換

1、塊級標籤轉換為行內標籤:display:inline;

2、行內標籤轉換為塊級標籤:display:block;

3、轉換為行內塊標籤:display:inline-block;

五、 巢狀規則 

塊標籤可以套行標籤,行標籤不可以套塊標籤。

p標籤不要套塊屬性標籤,可以套a,span。。。

巢狀的時候注意**的縮排。

行內元素 塊元素 行內塊元素 及其屬性

行內元素可以在一行顯示,但是不能設定上下的padding和margin值。塊級元素可以設定 width,height屬性,行內元素設定width,height無效 塊級元素可以設定margin 和 padding.行內元素的水平方向的padding left,padding right,margin...

塊級元素 行內元素 display屬性

定義位址 定義 標題 定義列表中定義條目 定義文件中的分割槽或節 定義列表 定義列表中的專案 定義乙個框架集 建立 html 表單 定義最大的標題值描述 none 此元素不會被顯示。block 此元素將顯示為塊級元素,此元素前後會帶有換行符。inline 預設。此元素會被顯示為內聯元素,元素前後沒有...

HTML 行內元素 塊級元素 行內塊元素的特點

html標籤按照元素種類可以分為行內元素 display inline 塊級元素 display block 和行內塊級元素 display inline block 三種。了解元素種類有利於,我們進行css布局及屬性的使用。相鄰元素可以在一行顯示直到一行排不下才進行換行。不可設定寬高 對齊等屬性,...