css的顯示對標籤分類:
塊狀元素
內聯元素(行內元素)
爭議點:
第三類:
a:可變元素
b:行內塊元素
元素型別分類:塊狀元素、內聯元素、可變元素。
注:把行內塊元素 歸在 內聯元素這一類裡面。
預設情況下元素型別每個型別特點:
塊狀元素特點:
1:在頁面中以矩形區域顯示。
2:自上而下排列,獨佔一行
3:可以直接新增寬高
4:一般情況下,作為其他元素或內容的容器
內聯元素特點:
1:在頁面中最小單位也是矩形。
2:在一行內逐個排列。
3:不可以直接新增寬高,大小是由內容撐開的。
4:內聯元素也符合盒模型的規則,但是個別屬性會出現問題
(比如:padding-top/bottom margin-top/bottom)
5: 內聯元素在一行內排列的時候,之間有間距
怎麼消除間距:
a:新增浮動
b:把所有的內聯元素都放在一行不用回車鍵(不推薦使用)。
可變元素(了解):
根據上下文的顯示,來確定這個元素是塊狀元素還是內聯元素
按按鈕按鈕按鈕鈕
哪些標籤屬於塊 哪些標籤屬於內聯:
塊狀元素:
div -最常用的塊級元素
dl - 和dt-dd 搭配使用的塊級元素
form - 互動表單
h1 -h6- 大標題
hr - 水平分隔線
ol – 有序列表
p - 段落
ul - 無序列表
lifieldset - 表單字段集
colgroup-col - 表單列分組元素
table-tr-td **及行-單元格
內聯元素:
a –超連結(錨點)
b - 粗體(不推薦)
br - 換行
i - 斜體
em - 強調
img -
input - 輸入框
label - 表單標籤
span - 常用內聯容器,定義文字內區塊
strong - 粗體強調
sub - 下標
sup - 上標
textarea - 多行文字輸入框
u - 下劃線
select - 專案選擇
元素型別的轉換:
display屬性:
作用:檢索或者設定元素生成的盒模型型別。
常用屬性值:
a: display:block;
作用:將元素轉成塊狀元素,擁有塊狀元素特點。
補充:大部分塊狀元素,預設的display的值都是block;
b: display:inline;
作用:將元素轉成內聯元素,擁有內聯元素的特點。
補充:大部分內聯元素,預設的display的值inline;
c: display:none;
作用:將當前隱藏,並不佔據空間。
HTML標籤元素的分類
在講解css布局之前,我們需要提前知道一些知識,在css中,html中的標籤元素大體被分為三種不同的型別 塊狀元素 內聯元素和內聯塊狀元素。常用的塊狀元素有 常用的內聯元素有 常用的內聯塊狀元素有 塊級元素 什麼是塊級元素?在html中 和 就是塊級元素。設定display block就是將元素顯示...
HTML標籤元素的分類
塊狀元素 內聯元素 內聯塊狀元素。常用的塊狀元素有 常用的內聯元素有 常用的內聯塊狀元素有 1 塊級元素 什麼是塊級元素?在html中 和 就是塊級元素。設定display block就是將元素顯示為塊級元素。如下 就是將行內元素a轉換為塊狀元素,使a元素具有塊狀元素特點。1a 塊級元素特點 1 每...
CSS元素分類
在css中,html中的標籤元素大體被分為三種不同的型別 塊狀元素 內聯元素 又叫行內元素 和內聯塊狀元素。常用的塊狀元素有 div p h1.h6 ol ul dl table address blockquote form 常用的內聯元素有 a span br i em strong label...