# 內聯元素和區塊元素 [TOC] ## 簡介 我們在之前的練習中發現，HTML標簽具有不同的特性。 實際上，我們可以將HTML元素分為兩大類：區塊元素和內聯元素。 ## 區塊元素 * 總是在新的一行上顯示。 * 高度、行高、寬度、內邊距、外邊距等都是可控制的。 * 高度默認為0，是根據元素內的內容而決定的，寬度是父元素的寬度，但是可以通過css控制它，顯示的指定他的寬度和高度，可以利用浮動和定位來將他與其他的塊元素也顯示在一行上。 * 實例: `<h1>`,`<p>`, `<ul>`,` <table>`。  **常用塊元素** * div -容器 * p -段落 * h -標題 * table -表格 ### `<div>`元素 * HTML`<div>`元素是塊級元素，它可用于組合其他HTML元素的容器。 * `<div>`元素沒有特定的含義。由于它屬于塊級元素，瀏覽器會在其前后顯示換行。 * 如果與 CSS 一同使用，`<div>`元素可用于對大的內容塊設置樣式屬性。  ## 內聯元素 * 內聯元素和其他的元素顯示在一行上。 * **上下邊距**、高度，寬度都是不可改變的，他的寬度是根據他的顯示文本和圖像的寬度。（關于`<img>`和`<input>`等元素為何寬高可變，可以自行學習什么是可替代元素） * 實例: `<b>`, `<td>`, `<a>`, `<img>`。  **常用的內聯元素** * a - 錨點 * em - 強調 * img - 圖片 ### `<span>`元素 * HTML `<span>`元素是內聯元素，可用作文本的容器 * `<span>`元素也沒有特定的含義。 * 當與 CSS 一同使用時，`<span>`元素可用于為部分文本設置樣式屬性。