前面講過(guò)了樣式，這一節(jié)講一些常用的樣式，也就是 HTML 預(yù)先定義的樣式，使用時(shí)更直接方便。

根據(jù)這些預(yù)定義樣式的使用場(chǎng)景，把它分成 文本格式化，計(jì)算機(jī)代碼和引用三大類。

除此之外，HTML 和 CSS 里定義了一些顏色名稱。

文本格式化

文本格式化的標(biāo)簽并不復(fù)雜，如果用過(guò)一些排版工具如 Word, WPS，就對(duì)以下的名詞不陌生。

標(biāo)簽

示意代碼：

<h1>文本格式化</h1> <b>b:粗體文本</b><br /> <em>em:著重文字</em><br /> <i>i:斜體字</i><br /> <small>small:小號(hào)字</small><br /> <strong>strong:加重語(yǔ)氣</strong><br /> <mark>mark:標(biāo)記，高亮</mark><br /> <sub>sub:下標(biāo)字</sub><br /> <sup>sup:上標(biāo)字</sup><br /> <ins>ins:插入字</ins><br /> <del>del:刪除字</del><br /> 

顯示效果：

?? strong 和 b 都對(duì)文本加粗，i 和 em 都使文本變斜體。

計(jì)算機(jī)代碼

計(jì)算機(jī)代碼的這些標(biāo)簽的默認(rèn)樣式并不是很明顯，了解一下即可。

標(biāo)簽

示意代碼：

<h1>計(jì)算機(jī)輸入</h1> <code>code:計(jì)算機(jī)代碼</code><br /> <kbd>kbd:鍵盤碼</kbd><br /> <samp>samp:計(jì)算機(jī)代碼樣本</samp><br /> <var>var:變量</var><br /> <pre>pre:預(yù)格式文本</pre> <br /> 

顯示效果：

引用

當(dāng)有一些對(duì)排版要求比較高的文字顯示需要時(shí)，才有可能會(huì)用到下面這些引用類的標(biāo)簽，對(duì)于常見的網(wǎng)頁(yè)開發(fā)來(lái)說(shuō)，這些用到的機(jī)會(huì)不多。

標(biāo)簽

示意代碼：

<h1>引用</h1> <abbr>abbr:縮寫</abbr><br /> <address>address:地址</address> <br /> <bdo dir="rtl">bdo:文字方向</bdo><br /> <blockquote>blockquote:長(zhǎng)的引用</blockquote> <br /> <q>q:短的引用語(yǔ)</q><br /> <cite>cite:引用、引證</cite><br /> 

顯示效果如下：

顏色

顏色的使用，大多要結(jié)合 CSS，這里只是講一下 HTML 里的顏色的概念。

顏色值

我們看到網(wǎng)頁(yè)中顯示的五顏六色的文字或背景，這些顏色在 HTML 里通過(guò)十六進(jìn)制的符號(hào)表示。

表示顏色的十六進(jìn)制符號(hào)由 紅色（Red）、綠色（Green） 和 藍(lán)色（Blue） 組合，也就是常見到的說(shuō)法 RGB 顏色。

每個(gè)顏色的最小值是 0，最大值是 255。用十六進(jìn)制表示最小值是 #00，最大值是 #FF。

那么三種顏色合在一起的十六進(jìn)制表示，就是 #RRGGBB。具體見下圖。

三種顏色每一個(gè)的值都有從 0 到 255 的變化，組合在一起就一共有 256 _ 256 _ 25 = 1600 萬(wàn)種不同顏色。

這么多顏色，不太可能在網(wǎng)頁(yè)中都用到。而且在 HTML 創(chuàng)立時(shí)，受限于計(jì)算機(jī)的處理能力，當(dāng)時(shí)僅能支持 256 種顏色。

在此背景下，Web 安全色被提出，是為了能讓開發(fā)的網(wǎng)頁(yè)在不同的設(shè)備上顯示效果一樣。

如今的計(jì)算機(jī)處理能力已經(jīng)非常強(qiáng)大，能顯示的顏色也不再只有 256 種，我們不再?gòu)?qiáng)調(diào) Web 安全色，但當(dāng)初為了它而定義的顏色名是為了方便顏色的使用。

顏色名

目前一共有 141 個(gè)顏色被所有瀏覽器支持。

這 141 個(gè)顏色是在 HTML 和 CSS 顏色規(guī)范里定義的，它包括 17 個(gè)標(biāo)準(zhǔn)顏色和另外 124 個(gè)顏色。

前面示例的代碼里，我們使用顏色名，也是同樣的效果。

<table>   <tr>     <th>顏色</th>     <th>十六進(jìn)制(HEX)</th>     <th>顏色</th>     <th>顏色名</th>     <th>RBG</th>   </tr>   <tr>     <td style="background-color: #000000;"></td>     <td>#000000</td>     <td style="background-color: black;"></td>     <td>black</td>     <td>RGB(0,0,0)</td>   </tr>   <tr>     <td style="background-color: #FF0000;"></td>     <td>#FF0000</td>     <td style="background-color: red;"></td>     <td>red</td>     <td>RGB(255,0,0)</td>   </tr>   <tr>     <td style="background-color: #00FF00;"></td>     <td>#00FF00</td>     <td style="background-color: yellow;"></td>     <td>yellow</td>     <td>RGB(0,255,0)</td>   </tr>   <tr>     <td style="background-color: #0000FF;"></td>     <td>#0000FF</td>     <td style="background-color: blue;"></td>     <td>blue</td>     <td>RGB(0,0,255)</td>   </tr> </table> 

顯示效果如下：

總結(jié)

• ?? 格式化文本是一些常見用于文本的樣式。

• ?? 計(jì)算機(jī)代碼是用于計(jì)算機(jī)場(chǎng)景下一些標(biāo)簽。

• ?? 引用包括縮寫，地址，詞的引用及文字方向。