主页 / 建站知识 /

pre 自动换行的问题

建站知识 2021-07-03 08:42www.168986.cn长沙网站建设
本站文章中使用了 pre 格式输出 代码。 而浏览器默认是强制不换行输出 pre 里的内容。这样的话，代码一长就出现了撑到页面外部的样子。在之前我都是有意的在代码里强制换行... 累啊. 今天有意的google了下，找到了

复制代码
代码如下:

pre {
whitewhite-space: pre-wrap; / css-3 /
whitewhite-space: -moz-pre-wrap; / Mozilla, since 1999 /
whitewhite-space: -pre-wrap; / Opera 4-6 /
whitewhite-space: -o-pre-wrap; / Opera 7 /
word-wrap: break-word; / Inter Explorer 5.5+ /
}

经测试，除IE[当前使用6]外, 其他可以.... 郁闷，然后增加 width:600px; 后，ok,.换行了，其实位置还是衍生出去了。样子是这样的 代码是在里面了，但狼蚁网站SEO优化的叙述性的东西却出了去。在说，定义一个这个宽度也不是个好的方法，其他的不直接改这个css的方法基本没有了。
然后看上面css想到， 为什么定义其他的都用 white-space 而定义 IE 的不使用呢? 又不是IE 不支持。。于是加上就可以了[翻了google的前5页, 没找到一个改css解决的...汗]。

复制代码
代码如下:

pre {
whitewhite-space: pre-wrap; / css-3 /
whitewhite-space: -moz-pre-wrap; / Mozilla, since 1999 /
whitewhite-space: -pre-wrap; / Opera 4-6 /
whitewhite-space: -o-pre-wrap; / Opera 7 /
word-wrap: break-word; / Inter Explorer 5.5+ /
whitewhite-space : normal ; / Inter Explorer 5.5+ /
}

至于本站上使用的是把ie和其他的分开了，因为white-space 在也都作用于其他了....

复制代码
代码如下:

pre {
whitewhite-space: pre-wrap; / css-3 /
whitewhite-space: -moz-pre-wrap; / Mozilla, since 1999 /
whitewhite-space: -pre-wrap; / Opera 4-6 /
whitewhite-space: -o-pre-wrap; / Opera 7 /
}


复制代码
代码如下:

html pre {
word-wrap: break-word; / Inter Explorer 5.5+ /
whitewhite-space : normal ; / Inter Explorer 5.5+ /
}
上一篇：CSS Sprites 技术分析 下一篇：CSS3 box-sizing属性

长沙网站设计

Copyright © 2016-2025 www.168986.cn 狼蚁网络 版权所有 Power by