javascript - 仅当单词对于整个句子来说太长时才使用连字符

标签 javascript css string

已经有很多关于单词连字符的问题,但只有当一个单词本身对于整个句子来说太长时,我找不到关于连字符的问题。

示例:

我希望它保持完整(不要试图将单词“verlichtingssysteem”放在上面一行并用连字符连接)

enter image description here

所以我不想要这个:

enter image description here

但是我想要一个不适合整行/div/页面的单词用连字符连接。否则我看不到完整的文本,如下所示。 (它会截掉最后 3 个字符)

enter image description here

我之前在其他问题上看到的所有解决方案都在最后两个示例上连字符,而不仅仅是最后一个示例。

因此,当单词按其自身宽度不适合整个 div/页面时,只需要使用连字符,因此当您有两个单词时,只需将单词放在下一行而不是连字符。

我只在移动设备上遇到这个词脱离屏幕的问题。但是(软)连字符在其他宽度较大的设备上会出现困惑,如图 2 所示。因此,我只需要它来表示一个单词,由它自己在一行中变大。

我不认为我是唯一有这种愿望的人吗?

最佳答案

你可以使用­

只有当单词与内容宽度重叠时,它才会中断单词。

使用它就像this­text­is­getting­long = thistextisgettinglong

看到这个 fiddle :http://jsfiddle.net/2r70mhnw/1/

您可能必须将容器的宽度设置为 100%,仅此而已!

http://en.wikipedia.org/wiki/Soft_hyphen

In computing and typesetting, a soft hyphen (ISO 8859: 0xAD, Unicode U+00AD soft hyphen, HTML: ­ ­) or syllable hyphen (EBCDIC: 0xCA), abbreviated SHY, is a code point reserved in some coded character sets for the purpose of breaking words across lines by inserting visible hyphens.

关于javascript - 仅当单词对于整个句子来说太长时才使用连字符,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29345650/

相关文章:

html - 包含内容的 div 与其他 div 重叠

html - 如何在 sass 中使用嵌套转换

html - 如何在 SASS 中定义动态混合或函数名称?

java - 如何将文本文件内容添加到文本文件包含空格的组合框中?

c# - 通过 [] 运算符访问字符串中的 char 是更快还是通过 [] 运算符访问 char[] 中的 char 更快?

javascript - 使用javascript的Strapi日期格式

javascript - 使用jquery向页面链接添加参数

Javascript 获取缩进 json 的唯一值

php - 选择国家/地区后插入文本框

php - 使用strpos改变变量内容