【CSS】html发生意外换行时可能需要这样设置

word-break : break-all;

通过使用 word-break 属性,可以让浏览器实现在任意位置的换行。

在这里插入图片描述

element-ui弹框中的意外事件:
在这里插入图片描述

设置后:

在这里插入图片描述

还帮助解决一个问题,word-break:break-all属性当字母加数字或者再加上符号都没问题,但是汉字+符号就有点问题了,

在这里插入图片描述

这种情况我是这样解决的:

在这里插入图片描述

核心代码:

    word-break: keep-all;
    overflow-wrap: anywhere;

overflow-wrap浏览器兼容性情况:

在这里插入图片描述

还遇到一个问题,发现使用pre标签不支持word-break:break-all属性,设置后还是不会换行,改为code标签就行了

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值