在瞭解 HTML 文件結構 之後，您已經知道，不論您如何在 標籤內將任何文字換行，網頁的結果其實還是不會換行，而且不論您加了多少空白，始終最多看到的結果還是只有一個空白，這樣怎麼行呢？

當然不行，我們可是要在網頁上放一些文章，或是寫一些產品介紹的啊，所以一定要有方式可以讓我們做一些基本排版呀。

換行其實很簡單，加入 標籤就可以了。

執行結果如下：

換行為什麼叫 呢？它是取自英文 a line break 斷行之意，而 break 就是中斷、換行的動作， 取自 break 的前兩個字母縮寫。這樣您記起來了嗎？

另外，眼尖的你可能有發現到，一般 HTML 的標籤不是都有像是 這樣的開始標籤，和 這樣的結束標籤嗎？為何 沒有呢？原因很簡單，因為 並不像其它標籤是一個「區塊」，在它所出現的地方就是立即要強迫換行的地方了，它不會包住任何其它的內容，所以它不需要有 結束標籤。聰明如你，這樣應該很容易懂吧！

為什麼我編寫的 HTML 中，加了很多空白還是無效呢？因為我們在 HTML 文件結構 這篇有提到， 網頁瀏覽器 其實是不管你的換行和多餘的空白的，即使所有內容都寫在同一行，瀏覽器還是會依您所下達的標籤語法去判斷要如何顯示。

就像上面的換行 連續用了 2 次，就換了兩行，而且 後面直接接著文字，它還是出現在換兩行後的最開頭，不會跟「哈囉！」連接在一起。

也就像在 HTML 文件結構 這篇的最後，我們有建議您儘量讓不同的標籤區塊去換行和內縮 HTML 內容，這樣您會比較好閱讀 (但對電腦而言是沒差的) ，也比較不容易寫錯，一個好的網頁設計師通常會這麼做。也因此，如果因為換行或內縮就讓你實際的內容格式跑掉了，那可不行呢！所以，當然瀏覽器預設對於內文換行和多餘空白是當作視而不見的。

因此，如果您直接在文字和文字中間空白了 5 次，或放更多的空白，實際上它還是只會有一個空白。例如：

執行結果如下：

上面的結果中，多餘的空白是不會有作用的。

而如果我們希望能夠連續顯示好幾個空白的話，可以像下面這樣以 ; 代替空白：

執行結果如下：

在 HTML 語法中，有一些已定義好的特殊符號，它們是以 "&" 為開頭，以 ";" 做結尾，之後我們會在別的篇章另外說明還有哪些常用的特殊符號。而 ; 就是屬於 HTML 的特殊符號之一「空格符號」，其 nbsp 取自於英文 a non-breaking space 的英文簡稱，其原意是「不會被間斷的空白」。

上面的換行或空格方式，不是要打 就是要用 ; ，如果偶爾用之還好，若一篇文章中許多地方用到，您可能會覺得有點麻煩吧 …

沒關係，我們另外還有一個 的標籤，可以用來解決您的困擾：

執行結果如下：

看到上面的執行結果之後，應該會覺得 標籤還蠻方便的吧！想空幾格就空幾格，想換幾行就換幾行，不用再打一些標籤語法和符號上去。

這麼好康的 標籤語法，它的 pre 取自於英文 preformatted text ，即「預先格式化文字」的簡稱，用白話一點的方式說，就是在 標籤區塊中的文字，您已經自己定好換行和空白的格式了，請網頁瀏覽器就按照那樣顯示就對了！

不過有個小地方您也要注意一下，看看上面 標籤中所包的 這整個區塊，我不在把它內縮進去，而是讓它出現在每一列的開頭。那是因為既然 已是「預先格式化的文字」，那麼如果您又為了 HTML 好閱讀而把它內縮的話，就會讓實際顯示在網頁瀏覽器上的執行結果文字也被內縮喔！所以使用時要注意這一點。

※ 本文歡迎大家在網頁中連結或加入我的最愛，但複製、引用、轉載或做其它商業用途者，請註明此原文出處及原始連結，未註明出處者必究。