根據(jù)css顯示分類,XHTML元素被分為三種類型:? 塊狀元素平夜,內(nèi)聯(lián)(行內(nèi))元素线脚,可變元素。
塊狀元素特點:
A: 塊狀元素在網(wǎng)頁中就是以塊的形式顯示板甘,所謂塊狀就是元素顯示為矩形區(qū)域党瓮,
B: 默認情況下,塊狀元素都會占據(jù)一行盐类,通俗地說寞奸,兩個相鄰塊狀元素不會出現(xiàn)并列顯示的現(xiàn)象;默認情況下在跳,塊狀元素會按順序自上而下排列枪萄。(如果想讓其在一行顯示就需對其添加浮動,添加浮動的同時要進行清理浮動帶來的影響)
C: 塊狀元素都可以定義自己的寬度和高度猫妙。
D: 塊狀元素一般都作為其他元素的容器瓷翻,它可以容納其它內(nèi)聯(lián)(行內(nèi))元素和其它塊狀元素。我們可以把這種容器比喻為一個盒子割坠。
*嵌套規(guī)則:p>p(錯誤)? p>div(錯誤)? span>p(錯誤)? div>p(正確) p>span(正確)
內(nèi)聯(lián)(行內(nèi))元素的特點:
A: 內(nèi)聯(lián)元素的表現(xiàn)形式是始終以行內(nèi)逐個進行顯示齐帚;
B: 內(nèi)聯(lián)元素沒有自己的形狀,不能定義它的寬和高,它顯示的寬度彼哼、高度只能根據(jù)所包含內(nèi)容的高度和寬度來確定对妄,它的最小內(nèi)容單元也會呈現(xiàn)矩形形狀;(將此元素轉(zhuǎn)換為塊級元素:display:block; 這樣就可以定義內(nèi)聯(lián)元素的寬高)
注:
1敢朱、大部分塊元素display屬性值默認為block剪菱,其中列表li的默認值為list-item梗肝。
2何吝、大部分內(nèi)聯(lián)元素的display屬性值默認為inline,其中img,input,默認為inline-block(行內(nèi)塊元素)
C: 內(nèi)聯(lián)元素也會遵循盒模型基本規(guī)則允乐,內(nèi)聯(lián)元素可以定義padding,border,margin,background等屬性篓吁,但個別屬性不能正確顯示;(padding-top/bottom;margin-top/bottom;)
1. 常用塊元素:
div -最常用的塊級元素
dl - 和dt-dd 搭配使用的塊級元素
form - 交互表單
h1-h6 大標題
hr - 水平分隔線
ol – 有序列表
p - 段落
ul -li 無序列表
fieldset - 表單字段集
colgroup-col - 表單列分組元素
table-tr-td? 表格及行-單元格
2. 常用內(nèi)聯(lián)(行內(nèi)塊)元素:
a –超鏈接(錨點)
b - 粗體(不推薦)
br - 換行? ? ? ? ? ? ? ? ? ? ? ? ? ?
i - 斜體
em - 強調(diào)? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?
label - 表單標簽? ? ? ? ? ? ? ? ?
span - 常用內(nèi)聯(lián)容器茫因,定義文本內(nèi)區(qū)塊
strong - 粗體強調(diào)
sub - 下標?
sup - 上標
u - 下劃線
select - 項目選擇?
(行內(nèi)塊元素)
img - 圖片? ? ? ? ? ? ? ? ? ? ? ?
input - 輸入框
textarea - 多行文本輸入框