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

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

当用户将鼠标悬停在元素上时,工具提示已显示它.

这是一个Fiddle.

如果您在上面的示例中看到,您将看到当用户添加带空格的消息时,浏览器会剪切空格中的单词,但是当用户添加没有空格的消息时,浏览器不会剪切单词(因为没有空间).

我一直试图解决白色空间,断字和文本溢出问题,但他们没有解决它.

这非常重要：我不想放一个特定的宽度,因为浏览器会自动计算元素的宽度.我可以解决这个问题,添加一个特定的宽度,但我不希望这样.

如果有人知道如何解决这个问题,我想向我解释这个问题的行为.

谢谢,
狮子座！

最佳答案

对我来说,通过添加工作

white-space: Nowrap;

在[data-msg] :: before {}之前

演示http://jsfiddle.net/QHD3A/

原文地址：https://www.jb51.cc/html/425979.html

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 [e-mail] 举报，一经查实，本站将立刻删除。