div强制自动换行,空格( )会连带前一个字符也会被换行。 10C
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <style type="text/css">
        .test {
            width: 80px;
            border: 1px solid #007AFF;
            word-wrap: break-word;
            margin-bottom: 10px;
        }
    </style>
    <body>
        <label>div1</label>
        <div class="test">
            不要被带跑
        </div>
        <label>div2</label>
        <div class="test">
            不要被带跑&nbsp;
        </div>
        <label>div3</label>
        <div class="test">
            不要被带跑<br />&nbsp;
        </div>
    </body>
</html>

div强制自动换行,空格会连带前一个字符也会被换行。
如何不加< br />也能像div3中的效果一样。
图片说明

4个回答

因为加上空格的长度第二个div长度太短了,你把长度改下图片说明

weixin_42322532
开局一个bug 回复qq358828690: 不是吗,这不是废话吗,再加几个字宽度又不够了,继续把款设置大点就行了,或者设置100%,这种问题你自己没有思考吗
10 个月之前 回复
qq358828690
qq358828690 再加上几个字也是一样会出现这个问题。所以不是长度的问题。
10 个月之前 回复

将div外层再加一层div,设置这个最外层的div宽度,内层div设置宽度为100%,想要不换行,宽度不能增加,那就只能设置影藏
图片说明
希望能给你一点启发,你再结合你的实际情况,修改这个外层div的长度,如果想要查看内层div的完整内容,可以使用

进行内容展示

代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title></title>
</head>
<style type="text/css">
    .test {
        width: 80px;
        border: 1px solid #007AFF;
        white-space: pre-wrap;/*保留换行符(enter)的作用*/
        margin-bottom: 10px;
    }
</style>
<body>
    <label>div1</label>
    <div class="test">不要被带跑<!--使用换行符(enter)直接换行-->
    </div>
    <label>div2</label>
    <div class="test">不要被带跑&nbsp;
    </div>
    <label>div3</label>
    <div class="test">不要被带跑<br />&nbsp;
    </div>
</body>
</html>

测试效果如下:

图片说明

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问