在css盒子模型中，html元素中有塊元素（block element）和內聯元素（inline element）。那麼它們究竟是什麼呢？
其實，這兩種元素都是html規範中的概念。塊元素(block element)一般是其他元素的容器元素，能容納其他塊元素或內聯元素。最常見的就是P和div這兩個，說的簡單點，塊元素就好比一個四方塊，可以放其他的四方塊，並可以呈現在頁面上任何地方。默認情況下塊元素，是獨佔一行的。常見的塊元素：div、h1-h6標題、form（只能用來容納其他塊元素）、hr、p、table、ul、ol等。內聯元素(inlineelement)也叫內嵌元素或行內元素，一般都是基於語義級(semantic)的基本元素。內聯元素只能容納文本或者其他內聯元素，常見內聯元素有a和span。
一.塊級元素和內聯元素的區別：
1.塊元素，總是在新行上開始；內聯元素，和其他元素在一行；
2.塊元素，能容納其他塊元素或者內聯元素；內聯元素，只能容納文本或其他內聯元素；
3.塊元素中高度，行高以及頂和底邊距都可以控制；內聯元素中高，行高及頂和底邊距不可改變。
(這上面的區別，指的是默認情況下的，不包括CSS的刻意控制。也就是說當使用css控制時，塊元素和內聯元素的屬性差異會越來越小。)
二.各自的特點：
1.block（塊）元素的特點：
①總是在新行上開始；
②高度，行高以及外邊距和內邊距都可控制；
③寬度缺省是它的容器的100%，除非設定一個寬度。
④它可以容納內聯元素和其他塊元素
2.inline元素的特點：
①和其他元素都在一行上；
②高，行高及外邊距和內邊距不可改變；
③寬度就是它的文字或圖片的寬度，不可改變；（寬度只與內容有關）
④內聯元素只能容納文本或者其他內聯元素
（不可以設置寬高，其寬度隨着內容增加，高度隨字體大小而改變，內聯元素可以設置外邊界，但是外邊界不對上下起作用，只能對左右起作用，也可以設置內邊界，但是內邊界在ie6中不對上下起作用，只能對左右起作用）
三、1.常見的塊元素：
address- 地址
blockquote - 塊引用
center - 舉中對齊塊
dir - 目錄列表
div - 常用塊級容易，也是css layout的主要標籤
dl - 定義列表
fieldset - form控制組
form - 交互表單
h1 - 大標題
h2 - 副標題
h3 - 3級標題
h4 - 4級標題
h5 - 5級標題
h6 - 6級標題
hr - 水平分隔線
isindex - input prompt
menu - 菜單列表
noframes - frames可選內容（對於不支持frame的瀏覽器顯示此區塊內容）
noscript - 可選腳本內容（對於不支持script的瀏覽器顯示此內容）
ol - 排序列表
p - 段落
pre - 格式化文本
table - 表格
ul - 非排序列表
2.常見的內聯元素：
a - 錨點
abbr - 縮寫
acronym - 首字
b - 粗體（不推薦）
bdo - bidi override
big - 大字體
br - 換行
cite - 引用
code - 計算機代碼（在引用源碼的時候需要）
dfn - 定義字段
em - 強調
font - 字體設定（不推薦）
i - 斜體
img - 圖片
input - 輸入框
kbd - 定義鍵盤文本
label - 表格標籤
q - 短引用
s - 中劃線（不推薦）
samp - 定義範例計算機代碼
select - 項目選擇
small - 小字體文本
span - 常用內聯容器，定義文本內區塊
strike - 中劃線
strong - 粗體強調
sub - 下標
sup - 上標
textarea - 多行文本輸入框
tt - 電傳文本
u - 下劃線
var - 定義變量
3.常見的可變元素：
可變元素爲根據上下文語境決定該元素爲塊元素或者內聯元素。
applet - java applet
button - 按鈕
del - 刪除文本
iframe - inline frame
ins - 插入的文本
map - 圖片區塊（map）
object - object對象
script - 客戶端腳本
4.常見的空元素：
<input /> <img /> <isindex/> <area /> <base /> <basefont />
<bgsound /> <col /> <embed /> <frame /> <keygen/> <link />
<meta /> <nextid /> <param /> <plaintext /> <spacer/> <wbr />
<!DOCTYPE> <!-- -->
四、塊級元素和內聯元素之間的轉換：
1.display
塊元素默認display:block;行內非替換元素(a,span)默認爲display：inline;行內替換元素(input)默認爲display:inline-block;
a.display:none; /*不顯示該元素，也不會保留該元素原先佔有的文檔流位置。*/
b.display:block; /*轉換爲塊級元素。*/
c.display:inline; /*轉換爲行內元素。*/
d.display:inline-block;轉換爲行內塊級元素。/*其實仍爲行內元素，但是可以設置width及height屬性等*/
2.float
當把行內元素設置完float:left/right後，該行內元素的display屬性會被賦予block值，且擁有浮動特性。行內元素去除了之間的莫名空白。
3.position
當爲行內元素進行定位時，position:absolute與position:fixed.都會使得原先的行內元素變爲塊級元素。