HTML-塊級元素和內聯元素

塊級元素	內聯元素
address - 地址 block - 塊引用 center - 居中對齊塊(不推薦) dir - 目錄列表(HTML5踢出) div - 常用的不能再常用了 dl - 列表 fieldset - 一個包含着form組的框 form - 表了個單   h1 ~ h6 各種尺寸標題 hr - 水平分隔線(不推薦) menu - 菜單列表 noframes - 瀏覽器不支持frames顯示的塊 noscript - 瀏覽器不支持script顯示的塊 ol - 有序列表 ul - 無序列表 p - 段落 pre - 格式化文本 table - 表了個格	a - 錨點 abbr - 縮寫(語義、利於搜索引擎) acronym - 首字(HTML5踢出) b - 粗體(不推薦) big - 大字體(不推薦) cite - 引用(語義、利於搜索引擎) code - 引用源碼(語義) em - 強調(如果僅為了斜體請用<i>) font - 字體設定(不推薦) i - 斜體 img - 圖片 input - 輸入框 label - 表單標簽(事件關聯對應表單項) q - 短引用(標准添加引號，IE不添加引號) s - 中划線(不推薦) samp - 用於提取內容 select - 項目選擇 small - 小字體(不推薦) strong - 粗體(不推薦) sub - 下標 sup - 上標 textarea - 多行文本輸入框 u - 下划線 var - 定義變量

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

學習html后, 你會了解一些基本的html元素(Element), 如p, h1~h6, br, div, li, ul, img等.
如果將這些元素細分, 又可以分別歸為頂級(top-level)元素,塊級(block-level)元素和內聯(inline)元素.   

1. Top-level element 【頂級元素】:    { html, body, frameset }
包括html, body, frameset, 表現如Block-level element, 屬於高級塊級元素.  

2. Block-level element 【塊級元素】:   { p, h1~h6, div, ul }
顧名思義就是以塊顯示的元素，高度寬度都是可以設置的。比如我們常用的 p, h1~h6, div, ul 默認狀態下都是屬於塊級元素。塊級元素比較霸道，默認狀態下每次都占據一整個行，后面的內容也必須再新起一行顯示。當然非塊級元素也可以通過css的display:block;將其更改成塊級元素。此外還有個特殊的，float也具有此功能。
塊級元素能夠獨立存在, 一般的塊級元素之間以換行(如一個段落結束后另起一行)分隔。塊級元素是構成一個html的主要和關鍵元素, 而任意一個塊級元素均可以用Box model來解釋說明.

3. Inline element 【內聯元素】: { a, br, em, img, li, span }
通俗點來說就是文本的顯示方式，與塊級元素相反，內聯元素的高度寬度是不可以設置的，其寬度就是自身文字或者圖片的寬度。我們常用到的<a>、<span>、<em>都屬於內聯元素。內聯元素的顯示特點就是像文本一樣的顯示，不會獨自占據一個行。當然內聯元素也能變成塊級元素，那就是通過css的display:inline;和float來實現。
內聯元素依附其他塊級元素存在, 緊接於被聯元素之間顯示, 而不換行.

      在《CSS權威指南》這樣定義到，“任何不是塊級元素的可見元素都是內聯元素。其表現的特性是“行布局”形式。”我個人不太習慣“行布局”的說話，因為我認為塊級元素從表現上更像“行”顯示，而內聯元素更像是“文本”的顯示屬性。這其中一點記住很關鍵，“內聯元素的高度寬度都是不可以設置的，其寬度就是自身文字或者圖片的寬度”。因為在你設置寬度高度大半天后沒反應才發現，原來這只是個內聯元素。