HTML標簽
html標簽定義：
- 是由一對尖括號包裹的單詞構成,例如: <html>.
- 標簽不區分大小寫<html> 和 <HTML>, 推薦使用小寫.
- 標簽分為兩部分: 開始標簽<html> 和 結束標簽</html>, 兩個標簽之間的部分我們叫做標簽體.
- 有些標簽功能比較簡單,使用一個標簽即可,這種標簽叫做自閉和標簽,例如: <br/><hr/><input/><img/>
- 標簽可以嵌套,例如:<a><b><b/><a/>;但是不能交叉嵌套,例如:<a><b><a/><b/>
所有的html標簽參考w3school中的html手冊.
css盒模型
所有HTML元素可以看作盒子，在CSS中，"box model"這一術語是用來設計和布局時使用。CSS盒模型本質上是一個盒子，封裝周圍的HTML元素，它包括：邊距，邊框，填充，和實際內容。盒模型允許我們在其它元素和周圍元素邊框之間的空間放置元素。
下面的圖片說明了盒子模型(Box Model)：
不同部分的說明：
- Margin(外邊距) - 清除邊框外的區域，外邊距是透明的。
- Border(邊框) - 圍繞在內邊距和內容外的邊框。
- Padding(內邊距) - 清除內容周圍的區域，內邊距是透明的。
- Content(內容) - 盒子的內容，顯示文本和圖像。
怪異模式和標准模式下的css盒模型的解析：
- 標准模式中，網頁元素的寬度是有padding,border,width三者的寬度相加決定的。
- 怪異模式中，width包含padding和border的寬度，即網頁寬度為width。
css3新增box-sizing屬性，用於更改用於計算元素寬度和高度的默認的 CSS 盒子模型：
- content-box，默認值。如果你設置一個元素的寬為100px，那么這個元素的內容區會有100px寬，並且任何邊框和內邊距的寬度都會被增加到最后繪制出來的元素寬度中，即標准模式下的盒模型。
- border-box 告訴瀏覽器去理解你設置的邊框和內邊距的值是包含在width內的。也就是說，如果你將一個元素的width設為100px,那么這100px會包含其它的border和padding，內容區的實際寬度會是width減去border + padding的計算值，即怪異模式下的盒模型。
塊級元素和行內元素的定義
塊級元素？
- 總是在新行上開始；
- 高度，行高以及外邊距和內邊距都可控制；
- 寬度缺省是它的容器的100%，除非設定一個寬度。
- 它可以容納內聯元素和其他塊元素
行內元素？
- 和其他元素都在一行上；
- 高，行高及外邊距和內邊距不可改變；
- 寬度就是它的文字或圖片的寬度，不可改變
- 內聯元素只能容納文本或者其他內聯元素
對行內元素，需要注意如下：
- 設置寬度width 無效。
- 設置高度height 無效，可以通過line-height來設置。
- 設置margin 只有左右margin有效，上下無效。
- 設置padding 只有左右padding有效，上下則無效。注意元素范圍是增大了，但是對元素周圍的內容是沒影響的。
通過display屬性對行內元素和塊級元素進行切換(主要看第2.3.4個值)：
| 值 | 描述 |
|---|---|
| none | 此元素不會被顯示。 |
| block | 此元素將顯示為塊級元素，此元素前后會帶有換行符。 |
| inline | 默認。此元素會被顯示為內聯元素，元素前后沒有換行符。 |
| inline-block | 行內塊元素。（CSS2.1 新增的值） |
| list-item | 此元素會作為列表顯示。 |
| run-in | 此元素會根據上下文作為塊級元素或內聯元素顯示。 |
| compact | CSS 中有值 compact，不過由於缺乏廣泛支持，已經從 CSS2.1 中刪除。 |
| marker | CSS 中有值 marker，不過由於缺乏廣泛支持，已經從 CSS2.1 中刪除。 |
| table | 此元素會作為塊級表格來顯示（類似 <table>），表格前后帶有換行符。 |
| inline-table | 此元素會作為內聯表格來顯示（類似 <table>），表格前后沒有換行符。 |
| table-row-group | 此元素會作為一個或多個行的分組來顯示（類似 <tbody>）。 |
| table-header-group | 此元素會作為一個或多個行的分組來顯示（類似 <thead>）。 |
| table-footer-group | 此元素會作為一個或多個行的分組來顯示（類似 <tfoot>）。 |
| table-row | 此元素會作為一個表格行顯示（類似 <tr>）。 |
| table-column-group | 此元素會作為一個或多個列的分組來顯示（類似 <colgroup>）。 |
| table-column | 此元素會作為一個單元格列顯示（類似 <col>） |
| table-cell | 此元素會作為一個表格單元格顯示（類似 <td> 和 <th>） |
| table-caption | 此元素會作為一個表格標題顯示（類似 <caption>） |
| inherit | 規定應該從父元素繼承 display 屬性的值。 |
塊級元素和行內元素的分類
html中的塊級元素：
| 標簽 | 描述 |
|---|---|
| <address> | 定義地址。 |
| <article> | 定義文章。 |
| <aside> | 定義頁面內容之外的內容。 |
| <audio> | 定義聲音內容。 |
| <blockquote> | 定義長的引用。 |
| <canvas> | 定義圖形。 |
| <caption> | 定義表格標題。 |
| <dd> | 定義定義列表中項目的描述。 |
| <div> | 定義文檔中的節。 |
| <dl> | 定義定義列表。 |
| <dt> | 定義定義列表中的項目。 |
| <details> | 定義元素的細節。 |
| <fieldset> | 定義圍繞表單中元素的邊框。 |
| <figcaption> | 定義 figure 元素的標題。 |
| <figure> | 定義媒介內容的分組，以及它們的標題。 |
| <footer> | 定義 section 或 page 的頁腳。 |
| <form> | 定義供用戶輸入的 HTML 表單。 |
| <h1> to <h6> | 定義 HTML 標題。 |
| <header> | 定義 section 或 page 的頁眉。 |
| <hr> | 定義水平線。 |
| <legend> | 定義 fieldset 元素的標題。 |
| <li> | 定義列表的項目。 |
| <menu> | 定義命令的列表或菜單。 |
| <meter> | 定義預定義范圍內的度量。 |
| <nav> | 定義導航鏈接。 |
| <noframes> | 定義針對不支持框架的用戶的替代內容。 |
| <noscript> | 定義針對不支持客戶端腳本的用戶的替代內容。 |
| <ol> | 定義有序列表。 |
| <output> | 定義輸出的一些類型。 |
| <p> | 定義段落。 |
| <pre> | 定義預格式文本。 |
| <section> | 定義 section。 |
| <table> | 定義表格。 |
| <tbody> | 定義表格中的主體內容。 |
| <td> | 定義表格中的單元。 |
| <tfoot> | 定義表格中的表注內容（腳注）。 |
| <th> | 定義表格中的表頭單元格。 |
| <thead> | 定義表格中的表頭內容。 |
| <time> | 定義日期/時間。 |
| <tr> | 定義表格中的行。 |
| <ul> | 定義無序列表。 |
html中的行內元素：
| 標簽 | 描述 |
|---|---|
| <a> | 定義錨。 |
| <abbr> | 定義縮寫。 |
| <acronym> | 定義只取首字母的縮寫。 |
| <b> | 定義粗體字 |
| <bdo> | 定義文字方向。 |
| <big> | 定義大號文本。 |
| <br> | 定義簡單的折行。 |
| <button> | 定義按鈕 (push button)。 |
| <cite> | 定義引用(citation)。 |
| <code> | 定義計算機代碼文本。 |
| <command> | 定義命令按鈕。 |
| <dfn> | 定義定義項目。 |
| <del> | 定義被刪除文本。 |
| <em> | 定義強調文本。 |
| <embed> | 定義外部交互內容或插件。 |
| <i> | 定義斜體字。 |
| <img> | 定義圖像。 |
| <input> | 定義輸入控件。 |
| <kbd> | 定義鍵盤文本。 |
| <label> | 定義 input 元素的標注。 |
| <map> | 定義圖像映射。 |
| <mark> | 定義有記號的文本。 |
| <objec> | 定義內嵌對象。 |
| <progress> | 定義任何類型的任務的進度。 |
| <q> | 定義短的引用。 |
| <samp> | 定義計算機代碼樣本。 |
| <select> | 定義選擇列表（下拉列表）。 |
| <small> | 定義小號文本。 |
| <span> | 定義文檔中的節。 |
| <strong> | 定義強調文本。 |
| <sub> | 定義下標文本。 |
| <sup> | 定義上標文本。 |
| <textarea> | 定義多行的文本輸入控件。 |
| <time> | 定義日期/時間。 |
| <tt> | 定義打字機文本。 |
| <var> | 定義文本的變量部分。 |
| <video> | 定義視頻。 |
| <wbr> | 定義可能的換行符。 |