HTML符號與特殊文字在有些時候一定會用到，本文先介紹如何調整font size大小，進行段落換行，接著以簡單範例具體說明，教你一次學會9個相關標籤的用法。
一、h1~h7標題大小
首先延續之前文章以論語電子書網頁為範例，先前用標題標籤h0到h8測試不同標題大小在網頁上如何呈現，從預覽頁面能清楚看到，h0與h8沒有任何設定效果。
二、font size用法
上個步驟的標籤是針對標題，HTML也可以直接對文字進行樣式設定，用到的標籤正是「font」，設定參數是「size」，也就是字型大小。截圖範例看到它跟Headline標題標籤有點類似，同樣都是1到7的參數值，size 1代表最小的字體，最大則是7，數字越大文字越大。如果參數值小於1，字型還是和size 1同樣尺寸，如果大於7，例如size 8的字體會和參數值7的一樣，這是font標籤與標題標籤h1到h7比較不同的地方。另外看到截圖中有一個「+2」，由於瀏覽器預設的文字大小是3，因此所謂的加2就是跟size 5同樣的字型大小。
另外還可以注意到標題標籤本身是區塊元素，也就是它具有佔據一整行或者自動換行的效果，這裡介紹的font標籤如果沒有設定任何區塊，會看到文字緊靠在一起，沒有自動換行的效果。
三、pre樣式保留
如果希望瀏覽器能夠依照HTML原始文字編排樣式呈現，可以使用「pre」這個HTML標籤，它會保留原始HTML文字版面的編排符號。例如在此有按下Enter鍵換行，如同上個步驟所見一般情況下，瀏覽器解析HTML編碼會忽略原始碼中的換行符號，加上pre標籤等於是請瀏覽器保留版面編排符號如實呈現，因此是右側預覽畫面那樣的換行效果。
四、br段落換行
上個步驟是用pre標籤保留原始程式碼的排版效果，重點是換行，其實在HTML有專門的換行標籤，也就是這裡看到的「br」，一個br代表一個換行，兩個br便是兩行的換行效果。
五、strong與em強調
介紹換行效果之後，接著想在網頁添加一些用於強調的標籤。首先是「strong」和「em」這兩個標籤都能夠加粗字體，不過在解讀上通常認為strong更有強調意味，瀏覽器預覽也可以看到strong的效果會比em稍微深一點。另外還有一個「cite」標籤會讓文字以斜體方式呈現，它比較偏向單純的改變樣式，沒有在語義上特地強調的作用。
六、u與strike效果
再介紹幾個HTML關於文字樣式的標籤。「u」是下底線，「strike」是刪除線，還有一些在特殊場合會用到的備註文字，上下標分別使用「sup」與「sub」，參考右側預覽效果很容易能瞭解各個標籤的作用。
七、特殊符號編碼
從先前步驟可得知善用HTML標籤能達成文章版面的編排，不過也許會遇到一個狀況：希望網頁上呈現和HTML標籤同樣的特殊符號，例如向左向右箭頭，或是在文字裡面加上空格，這些情況應該使用HTML特殊編碼，例如：「 」是空格的特殊符號編碼，英文的單雙引號可以輸入「’」跟「”」，「<」與「>」分別代表小於和大於符號。
HTML標籤符號參考筆記
這篇文章首先介紹HTML樣式標籤以及特殊符號，實際使用就知道HTML標籤通常使用意思相近的英文單字或簡稱，例如strong或者em，容易記憶而且相當直覺。至於特殊符號基本上沒有規則可言，不過在實務上使用的機會不多，不用特別記住相對應的編碼，因為很容易會忘記。贊贊小屋建議把可能會用到的特殊符號編碼做個筆記，有需要的時候再參考使用即可。進一步說，就算HTML標籤容易記憶，可是不常使用的部分，同樣用筆記方式作為參考，毋須強記，如此進行網頁設計會更有效率。
本文章講解影片：
歡迎加入Line社群，口袋裡的VBA小教室！
贊贊小屋服務：3,000元網頁設計，5,000元Google Kinsta主機，8,000元Excel ERP系統。
學習目前最熱門的程式，歡迎報名Python課程：
