html pre標簽的定義和用法：

pre 元素可定義預格式化的文本。被包圍在 pre 元素中的文本通常會保留空格和換行符。而文本也會呈現為等寬字體。

pre 標簽的一個常見應用就是用來表示計算機的源代碼。

可以導致段落斷開的標簽（例如標題、 p 和 address 標簽）絕不能包含在 pre 所定義的塊里。盡管有些瀏覽器會把段落結束標簽解釋為簡單地換行，但是這種行為在所有瀏覽器上并不都是一樣的。

pre 元素中允許的文本可以包括物理樣式和基于內容的樣式變化，還有鏈接、圖像和水平分隔線。當把其他標簽（比如 a 標簽）放到 pre 塊中時，就像放在 HTML/XHTML 文檔的其他部分中一樣即可。請看下面的例子：

 pre  html  head  script type= quot;text/javascript quot; src= quot;loadxmldoc.js quot;  /script  /head  body  script type= quot;text/javascript quot;  xmlDoc= a href= dom_loadxmldoc.asp loadXMLDoc /a ( quot;books.xml quot;); document.write( quot;xmlDoc is loaded, ready for use quot;); /script  /body  /html  /pre 

在上面的代碼中， pre 標簽中的特殊符號被轉換為符號實體，比如 代表 ， 代表 。另外，請注意藍色的代碼，我們在 pre 標簽中使用了鏈接，也就是 a 標簽。上面這段代碼的顯示效果如下：

 html  head  script type= text/javascript src= loadxmldoc.js  /script  /head  body  script type= text/javascript  xmlDoc=loadXMLDoc( books.xml  document.write( xmlDoc is loaded, ready for use  /script  /body  /html 

html pre標簽可選的屬性:

width : number : 定義每行的最大字符數（通常是 40、80 或 132）。

html pre 標簽的作用及使用說明：

1、該標簽可定義預格式化的文本，被包圍在 pre 元素中的文本通常會保留空格和換行符，并且文本會呈現為等寬字體。該標簽的一個常見應用就是用來表示計算機的源代碼。

2、該元素中允許的文本可以包括物理樣式和基于內容的樣式變化，還有鏈接、圖像和水平分隔線。當把其他標簽（比如 a 標簽）放到 pre 塊中時，就像放在 HTML/XHTML 文檔的其他部分中一樣即可。

3、標簽中的特殊符號被轉換為符號實體，比如 代表 ， 代表 。

4、可以導致段落斷開的標簽（比如 h1 、 p 和 address 標簽）盡量不要包含在 pre 所定義的塊里，我試過現在的瀏覽器（Google、IE和火狐），雖然可以把段落結束標簽解釋為簡單地換行，但是在代碼編輯器里會報錯 Invalid location of tag (h1).

 !DOCTYPE html  html  head  meta charset= utf-8  /head  body  pre 你好 我是Natalie 我即將成為 h1 一名技術 /h1 人員。

HTML 與 XHTML 之間的差異

在 HTML 4.01 中，pre 元素的 width 屬性是不被贊成使用的。

在 XHTML 1.0 Strict DTD 中，pre 元素的 width 屬性是不被支持的。

提示和注釋:

提示：制表符（tab）在 pre 標簽定義的塊當中可以起到應有的作用，每個制表符占據 8 個字符的位置。但是我們不推薦使用它，因為在不同的瀏覽器中，Tab 的實現各不相同。在用 pre 標簽格式化的文檔段中使用空格，可以確保文本正確的水平位置。

提示：如果您希望使用 pre 標簽來定義計算機源代碼，比如 HTML 源代碼，請使用符號實體來表示特殊字符，比如 代表 ， 代表 ， amp; 代表 。

提示：在 W3School 中，非常多頁面中的源代碼實例都是通過 pre 標簽定義的，您可以參考這些頁面，學習如何使用該標簽。我們甚至把 pre 標簽與 code 標簽結合起來使用，以獲得更加精確的語義。

【相關推薦】

html5 border屬性怎么設置？html5 table中的border屬性介紹

HTML ins標簽常用的用法有哪些？HTML ins常用屬性的介紹

以上就是html pre標簽的作用是什么？html pre標簽用法及其屬性詳解的詳細內容，html教程

鄭重聲明：本文版權歸原作者所有，轉載文章僅為傳播更多信息之目的，如作者信息標記有誤，請第一時間聯系我們修改或刪除，多謝。