html 中的 pre 標(biāo)簽?zāi)J(rèn)是不會(huì)換行的，即使聲明了 word-wrap 和 word-break 屬性也沒(méi)有效果；div 標(biāo)簽可以很方便的換行，不會(huì)把頁(yè)面撐破。因?yàn)檫@個(gè)原因，很多網(wǎng)站在顯示代碼的時(shí)候使用 div 來(lái)作為容器。使用 div 標(biāo)簽裝載代碼有個(gè)弊端，就是冗余內(nèi)容太多，換行，制表符，空格等都需要轉(zhuǎn)換，自然源代碼的體積也大了不少。若一定要使用 div 標(biāo)簽，也可以通過(guò) white-space 來(lái)控制 div 中內(nèi)容顯示的樣式，此舉也是可以的。
本人認(rèn)為，在源代碼中使用 pre 標(biāo)簽作為代碼容器是首選，后期前端再用其他的 javascript 代碼高亮插件美化渲染，那又另當(dāng)別論。使用 css 將 pre 中內(nèi)容換行的樣式如下，測(cè)試發(fā)現(xiàn)效果還不錯(cuò)。
<style>
pre{
white-space: pre-wrap; /* css-3 */
white-space: -moz-pre-wrap; /* mozilla, since 1999 */
white-space: -pre-wrap; /* opera 4-6 */
white-space: -o-pre-wrap; /* opera 7 */
word-wrap: break-word; /* internet explorer 5.5+ */
overflow: auto;
word-break: break-all;
word-wrap: break-word;
}
</style>
公眾號(hào)
事業(yè)單位
當(dāng)前位置：
公考類
招聘類
各類考試