CSS容器内容超出(溢出)自动换行代码(支持多浏览器)-优快云博客

本文链接：https://blog.youkuaiyun.com/iteye_3952/article/details/81998528

本文介绍了一种CSS样式设置方法，该方法可以实现在不同浏览器间的良好兼容性，并确保文本能够正常断行显示。通过定义特定的CSS类，本文详细展示了如何设置border、clear属性及针对不同浏览器的white-space属性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

今天发现一很好的CSS代码

完美支持IE，Firefox，Opera等浏览器。

<style>

    .linebr {
        border:solid 1px red;
        clear: both; /* 清除左右浮动 */
        width: 100px; /* 必须定义宽度 */
        word-break: break-word; /* 文本行的任意字内断开 */
        word-wrap: break-word; /* IE */
        white-space: -moz-pre-wrap; /* Mozilla */
        white-space: -hp-pre-wrap; /* HP printers */
        white-space: -o-pre-wrap; /* Opera 7 */
        white-space: -pre-wrap; /* Opera 4-6 */
        white-space: pre; /* CSS2 */
        white-space: pre-wrap; /* CSS 2.1 */
        white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
        font-size:12px;
    }
</style>

<div class="linebr">ssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss</div>