讓pre標籤自動換行範例程式碼_HTML/Xhtml_網頁製作

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

 標籤的一個常見應用就是用來表示電腦的原始碼。對於技術部落格經常會用到pre標籤輸出程式碼或是程式碼高亮，而預設情況下，pre 標籤中的內容若超出範圍不會自動換行。 <br>以下介紹一個方法讓<pre class="brush:php;toolbar:false"> 標籤中的內容自動換行並符合W3C 標準（多重瀏覽器支援） <br><br><div class="msgheader"><div class="right"><span style="CURSOR: pointer" onclick="copycode(getid('phpcode32'));"><u>複製程式碼</u></span></div></div>複製程式碼<div class="msgborder" id="phpcode32"> <br><br>程式碼如下:<br><br> <br>pre{ <br>white-space:pre-wrap; /* css3.0 */ <br>white-space:-moz-pre- wrap; /* Firefox */ <br>white-space:-pre-wrap; /* Opera 4-6 */ </div>white-space:-o-pre-wrap; /* Opera 7 */ <br> word-wrap:break-word; /* Internet Explorer 5.5 */ <br>} <br><div class="msgheader"><div class="right">範例： <span style="CURSOR: pointer" onclick="copycode(getid('phpcode33'));"><u></u></span>
</div></div>複製程式碼<div class="msgborder" id="phpcode33">
<br><br>程式碼如下:</div> pre{white-space:pre-wrap; white-space:-moz-pre-wrap; white-space:-pre-wrap ; white-space:-o-pre-wrap; word-wrap:break-word; /*我是一個很長很長的程式碼，看我換行了木頭？ */}