超文字標記語言/文字格式
文字格式元素為您的HTML文件中的短語提供邏輯結構。這種結構通常透過更改文字的外觀呈現給使用者。
我們在這本書的簡介中看到了如何透過使用<em></em>標籤來強調文字。圖形瀏覽器通常以斜體顯示強調文字。一些螢幕閱讀器，即向用戶朗讀頁面的實用程式，可能會用不同的語調朗讀強調的單詞。
一個常見的錯誤是標記元素以獲得特定的外觀，而不是標記其含義。 當在多個瀏覽器中測試時，這個問題會變得更加明顯，尤其是在圖形和純文字瀏覽器以及螢幕閱讀器中。
您可以使用層疊樣式表更改任何元素的預設呈現。例如，如果您希望所有強調文字都以紅色普通文字顯示，您將使用以下 CSS 規則
em { font-style:normal; color:red; }
在本節中，我們將探討一些基本方法，您可以使用這些方法來標記文件的邏輯結構。
HTML 有兩種程度的強調元素
em元素用於強調文字，通常以斜體顯示。strong元素用於強烈強調文字，通常以粗體顯示。
強調文字示例
It is essential not only to guess but actually <em>observe</em> the results.
渲染示例
強烈強調文字示例
Let us now focus on <strong>structural markup</strong>.
渲染示例
預格式化文字使用固定寬度字型渲染，並且不會將多個空格壓縮為一個空格，從而保留空格。換行符將作為換行符渲染，與預格式化文字之外的情況不同。預格式化文字中的 HTML 標記仍由瀏覽器解釋，這意味著“<em>a</em>”仍將渲染為“a”。
要建立預格式化文字，請以<pre>開頭，以</pre>結尾。
示例
<pre>
,-----------------------,
| No. | Person |
|-----------------------|
| 1. | Bill Newton |
| 2. | Magaret Clapton |
'-----------------------'
</pre>
渲染結果
,-----------------------, | No. | Person | |-----------------------| | 1. | Bill Newton | | 2. | Magaret Clapton | '-----------------------'
省略預格式化標籤會導致相同的文字在一行中顯示
,-----------------------, | No. | Person | |-----------------------| | 1. | Bill Newton | | 2. | Magaret Clapton | '-----------------------'
要插入非標準字元或在 HTML 中具有特殊含義的字元，需要使用字元引用。例如，要輸入“&”，必須鍵入“&”。字元也可以透過其 ASCII 或 Unicode 編號程式碼插入。
|
|
縮略詞
[edit | edit source]另一個有用的元素是 abbr。它可以用來為縮略詞提供定義，例如：
<abbr title="HyperText Markup Language">HTML</abbr>
- 將顯示為：HTML
- 當你將滑鼠懸停在 HTML 上時，你會看到 HyperText Markup Language
圖形瀏覽器通常會用虛線來顯示縮略詞。title 會以工具提示的形式出現。螢幕閱讀器可能會根據使用者的請求讀取 title。
注意：非常舊的瀏覽器（Internet Explorer 6 及更低版本）不支援 abbr。因為它們支援相關的元素 acronym，所以該元素通常用於所有縮略詞。
首字母縮略詞是一種特殊的縮略詞，其中幾個單詞的字母組合在一起發音形成一個新詞（例如雷達 - 無線電探測和測距）。HTML 中的字母單獨發音，從技術上來說，它是一種不同的縮略詞，稱為首字母縮寫詞。
不鼓勵的格式
[edit | edit source]HTML 支援各種格式元素，不鼓勵使用它們，而建議使用層疊樣式表 (CSS)。以下是對不鼓勵使用的格式的簡要概述，以便你在某些網頁中看到它們時知道它們是什麼，並知道如何用 CSS 格式替換它們。一些不鼓勵使用的元素只是不鼓勵使用，而另一些則是除了被棄用之外，還被棄用。
| 元素 | 效果 | 示例 | 狀態 | CSS 替代方案 |
|---|---|---|---|---|
b
|
粗體 | 粗體 | font-weight: bold;
| |
i
|
斜體 | 斜體 | font-style: italic;
| |
u
|
下劃線 | 下劃線 | 已棄用 | text-decoration: underline;
|
tt
|
打字機字型 | 打字機字型 | font-family: monospace;
| |
s
|
刪除線 | 已棄用 | text-decoration: line-through;
| |
刪除線
|
刪除線 | <strikethrough>strikethrough</strikethrough> | 已棄用 | text-decoration: line-through;
|
big
|
大字型 | big | font-size: larger;
| |
small
|
小字型 | small | font-size: smaller;
| |
font
|
字型大小 | size=1 | 已棄用 | font-size:(value) |
center
|
居中一個塊 | 已棄用 | text-align: center;
|
層疊樣式表
[edit | edit source]使用諸如 <b> 用於 粗體 或 <i> 用於 斜體 的樣式元素非常簡單，但它將表示層與內容層耦合在一起。透過使用層疊樣式表，HTML 作者可以將這兩個截然不同的部分解耦，以便一個正確標記的文件可以以各種方式呈現，而文件本身保持不變。例如，如果釋出者希望將文件中引用的參考文獻顯示為 粗體 文字，因為它們以前是 斜體，他們只需要更新樣式表，而不必逐個修改文件，將 <b> 更改為 <i> 反之亦然。層疊樣式表還允許讀者做出這些選擇，覆蓋釋出者的選擇。
繼續以上面的示例為例，假設釋出者已正確標記了所有文件，將所有對引用的材料（例如書名）的引用都用<cite>標籤
<cite>了不起的蓋茨比</cite>
然後，要使所有引用的參考文獻都為粗體，你可以在樣式表中新增以下內容
cite { font-weight: bold; }
之後，有人告訴你參考文獻實際上需要是斜體。在 CSS 之前，你需要在所有文件中搜索，將 <b> 和 </b> 更改為 <i> 和 </i>（但要小心不要更改那些不是引用的參考文獻的粗體字）。
但有了 CSS，只需要更改樣式表中的一行即可
cite { font-style: italic; }