根據css顯示分類，xhtml元素被分為
三種型別:塊狀元素，內聯元素，行內塊元素、可變元素
1.塊狀元素（block element）
a）塊狀元素在網頁中就是以塊的形式顯示，所謂塊狀就是元素顯示為矩形區域，常用的塊狀元素包塊div,dl,dt,dd,ol,ul,fieldset,(h1-h6),p,form,hr,colgroup,col,table,tr,td,等；b）預設情況下，塊狀元素都會佔據一行，通俗地說，兩個相鄰塊狀元素不會出現並列顯示的現象；預設情況下，塊狀元素會按順序自上而下排列。
c）塊狀元素都可以定義自己的寬度和高度。
d）塊狀元素一般都作為其他元素的容器，它可以容納其它內聯元素和其它塊狀元素。我們可以把這種容器比喻為乙個盒子
2.內聯元素（inline element）（或是行內元素）
a) 常見的內聯元素如：a,span,i,em,strong,b等3.內聯塊狀元素b) 內聯元素的表現形式是始終以行內逐個進行顯示；
c) 內聯元素沒有自己的形狀，不能定義它的寬和高,它顯示的寬度、高度只能根據所包含內容的高度和寬度來確定，它的最小內容單元也會呈現矩形形狀；
d)內聯元素也會遵循盒模型基本規則，如可以定義padding,border,margin,background等屬性，但個別屬性值不能正確顯示;
a - 錨點 i - 斜體 em - 傾斜
span - 常用內聯容器，定義文字內區塊
strong - 粗體強調 b--加粗
內聯塊狀元素（inline-block）就是同時具備內聯元素、塊狀元素的特點，inline-block元素特點：4、可變元素a、和其他元素都在一行上；
b、元素的高度、寬度、行高以及頂和底邊距都可設定
需要根據上下文關係確定該元素是塊元素或者內聯元素。盒子模型可通過display屬性來改變預設的顯示型別
1）display屬性與屬性值 (18個屬性值)
屬性值：block/inline/inline-block/none/list-item/table-header-group/table-footer-group作用：塊狀元素和內聯元素之間的轉換。
說明：各屬性值的作用
1)block塊狀顯示：類似在元素後面新增換行符，也就是說其他元素不能在其後面並列顯示。或者就是讓元素豎排顯示。inline-block行內塊元素顯示：元素的內容以塊狀顯示，行內的其他元素顯示在同一行。2)inline內聯顯示：在元素後面刪除換行符，多個元素可以在一行內並列顯示。或者就是讓元素橫排顯示。
3)當元素設定了float屬性後，就相當於該元素具備塊狀元素顯示的特點；
4)inline-block行內塊元素顯示：元素的內容以塊狀顯示，行內的其他元素顯示在同一行。
（只有這乙個元素型別支援vertical-align屬性）img,input
垂直對齊方式
5)none 此元素不會被顯示。
6)list-item:將元素轉換成列表。li的預設型別。
7）a、大部分塊元素display屬性值預設為block，其中列表的預設值為list-item。
b、大部分內聯元素的display屬性值預設為inline,其中img,input，預設為inline-block。
（只有這乙個元素型別支援vertical-align屬性）img,input
垂直對齊方式
常見應用案例：不同大小的在div當中垂直居中
拓展：一、引題
在之前的**html中的塊級元素和內聯元素中了解到了內聯元素一般是不能設定寬高的，但是也有特殊。比如img是內聯元素，但可以設定寬高，這肯定讓不少人迷惑。這樣我們就要引入html中置換元素的概念（非置換元素在w3c中沒有給出明確的解釋，姑且我們就把除置換元素外的元素當作非置換元素吧）。
二、置換元素與非置換元素
a) 置換元素：瀏覽器根據元素的標籤和屬性，來決定元素的具體顯示內容。
例如：瀏覽器會根據
置換元素在其顯示中生成了框，這也就是有的內聯元素（img,input）能夠設定寬高的原因。
b) 不可替換元素（非置換元素）：(x)html 的大多數元素是不可替換元素，即其內容直接表現給使用者端（如瀏覽器）。
返回頂部
收藏
5 CSS元素型別
根據css顯示分類，xhtml元素被分為 三種型別 塊狀元素，內聯元素，行內塊元素 可變元素 1.塊狀元素 block element a 塊狀元素在網頁中就是以塊的形式顯示，所謂塊狀就是元素顯示為矩形區域，常用的塊狀元素包塊div,dl,dt,dd,ol,ul,fieldset,h1 h6 p,f...
CSS筆記5 CSS樣式
div塊級元素 作用 包圍 換行 span內聯元素 作用 包圍 不換行 font font size 字型大小 font family 字型 如果字型商用，一定要注意版權問題 font style 字型風格 italic oblique斜體 normal預設 font weight 粗細 bord粗...
HTML學習筆記 5 CSS
1.css指層疊樣式表 cascading style sheet 用以定義html元素的樣式。css規則由兩個主要部分構成 選擇器和一條或多條宣告。即 selector 注1 可以對選擇器進行分組，這樣被分組的選擇器可以共享宣告。注2 子元素繼承父元素的所有宣告的屬性。但是若子元素需要特殊的宣告，...