1、塊元素(block)獨占一行,里面可包含塊元素和內聯元素,并且width與height對它起作用。
2、內聯元素只能容納文本或其他內聯元素(不推薦內聯元素里包含塊元素),它允許與其他內聯元素位于同一行內,比如span,但,width與height對它不起作用。
3、當然,塊元素與內聯元素是可以相互轉換的,給塊元素設置display:inline;或給內聯元素設置display:block;即可轉換。
4、區別
塊元素:可以設置width與height,獨占一行,padding與margin在水平與垂直方向均有效;寬度默認是它所在容器的100%,高度默認是內容高度。
內聯元素:不可設置寬高,不會獨占一行,padding與margin只在水平方向有效,寬度就是它所容納的文字或圖片的寬度,不可改變。
5、常見的塊元素
* address - 地址
* blockquote - 塊引用
* center - 居中對齊塊
* dir - 目錄列表
* div - 常用塊級容易,也是css layout的主要標簽
* dl - 定義列表 dt dd
* fieldset - form控制組
* form - 交互表單 (只能用來容納其它塊元素)
* h1 - 大標題
* h2 - 副標題
* h3 - 3級標題
* h4 - 4級標題
* h5 - 5級標題
* h6 - 6級標題
* hr - 水平分隔線
* isindex - input prompt
* menu - 菜單列表
* noframes - frames可選內容,(對于不支持frame的瀏覽器顯示此區塊內容
* noscript - 可選腳本內容(對于不支持script的瀏覽器顯示此內容)
* ol - 排序表單 li?
* p - 段落
* pre - 格式化文本
* table - 表格 caption thead tbody tfoot th tr td
* ul - 無序列表 li。?
6、常見的內聯元素
* 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 - 定義變量