HTML – 如果有空格,如何解决“单词切割”？

发布时间：2020-12-14 22:51:21 所属栏目：资源来源：网络整理

导读：我一直在工具提示库中工作.这个想法很简单：在任何HTML元素中添加自定义数据属性(我的意思是数据),其中包含用户想要在工具提示中显示的消息,例如：当用户将鼠标悬停在元素上时,工具提示已显示它. 这是一个Fiddle. 如果您在上面的示例中看到,您将看到当用户

我一直在工具提示库中工作.这个想法很简单：在任何HTML元素中添加自定义数据属性(我的意思是数据),其中包含用户想要在工具提示中显示的消息,例如：


当用户将鼠标悬停在元素上时,工具提示已显示它.
这是一个Fiddle.
如果您在上面的示例中看到,您将看到当用户添加带空格的消息时,浏览器会剪切空格中的单词,但是当用户添加没有空格的消息时,浏览器不会剪切单词(因为没有空间).
我一直试图解决白色空间,断字和文本溢出问题,但他们没有解决它.
这非常重要：我不想放一个特定的宽度,因为浏览器会自动计算元素的宽度.我可以解决这个问题,添加一个特定的宽度,但我不希望这样.
如果有人知道如何解决这个问题,我想向我解释这个问题的行为.
谢谢,
狮子座！


最佳答案
对我来说,通过添加工作

white-space: nowrap;

在[data-msg] :: before {}之前
演示http://jsfiddle.net/QHD3A/
                        （编辑：李大同）
【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!