pre 标签中的代码时常会超出模板的边界，这时我们就得想想办法了：

办法一:强制要出界的代码换行

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+ */
}

办法二:即将出界的代码隐藏起来，这时出现横向滚动条

pre { width:521px; overflow: auto; overflow-y:hidden}

这两个办法均能通过在W3C的CSS检验，方法一已经在本博客代码页面实现。

原帖:http://xizhiabc.info/dev/191-pre-tips-force-line-and-horizontal-scroll-bar

© 2011, 深夜的蚊子. 版权所有. 如转载，请注明：转载自 蚊子空间[http://www.wenzizone.cn]