CSS让PRE标签强制换行

CSS让PRE标签强制换行

2015.12.30 00:33

有时候在文章中插入pre标签，如果一行代码过长，超出了外部容器的宽度，要么把盒子撑破打乱布局，要么设置了overflow:hidden，有一部分代码就看不到了，其实这样很不友好，pre标签的里面的文本默认是不会自动换行的，但是CSS代码可以让他强制换行，请看下面代码：       

pre {

 white-space: pre-wrap;      /* css-3 */

 white-space: -moz-pre-wrap;  /* Mozilla, since1999 */

 white-space:-pre-wrap;      /* Opera 4-6 */

 white-space: -o-pre-wrap;    /*Opera 7 */

 word-wrap:break-word;       /* Internet Explorer 5.5+ */

}

上面的代码几乎可以兼容所有浏览器，你只需要添加到你的css文件中即可。