我有一段文字,最后我要插入两个图标。
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim
veniam, quis nostrud exercitation ullamco laboris <img ...><img ...>
我想保持两个图像连接,如果图像溢出,则应该转到新行,所以我需要的是
,但宽度为零。
是否有一个html实体可以做到这一点或其他方式来实现这一点而不使用包装器?
答案 0 :(得分:21)
HTML中没有ZWNBSP(零宽度不间断空格)的实体引用,但它与任何Unicode字符一样,可以使用字符引用表示:
(或等效地,{{ 1}})。但是,将图像保持在同一行是无效的。图像不是字符,即使在字符之间使用,浏览器也不需要为ZWNBSP实现Unicode语义。这同样适用于WORD JOINER,U + 2060。
最有效的方法是将
标记包装在nobr
element:img
中。虽然不是任何HTML规范的一部分,并且在HTML5草案中被称为“过时”,但此方法适用于各种浏览器。如果你宁愿以笨拙的方式做一些在禁用CSS时不起作用的事情,你可以使用一个人工包装元素并在其上设置<nobr><img ...><img ...></nobr>
。
答案 1 :(得分:20)
No-Break Space与Word-Joiner非常相似,就像它与Space一样。但每一种,都有着截然不同的用法。存在所有这些变化以表示空格字符的不同宽度和功能。
与空格字符的表示方式类似,可防止自动换行。 
一个有点等于数字(0-9)字符的空格。 
或&nnbsp;
)用于将词缀与词干分开而不指示词边界。大约是正常空间的代表空间的1/3,尽管它可能因字体而异。⁠
代表没有明显的字符,它禁止在其位置换行。W3C建议您在需要连接两个字符或单词时使用Word-Joiner,以便它们不会换行。 的 [1] 强>
为了获得相同的功能,以前通过ZERO-WIDTH NON-BREAKING SPACE提供的作者应该使用WORD JOINER(U + 2060)而不是
但是,HTML4字符参考中没有提到的 Word-Joiner 。 的 [2] 强>
除了这些字符之外, SOFT HYPHEN(U + 00AD)还可以用来提供UA在自己的连字词典中可能没有的单词中的换行提示。
明确不鼓励的唯一字符是 ZERO WIDTH NON-JOINER(U + 200C):防止字符之间的连接和草书连接,否则将以其他方式连接或以粗俗方式连接。 - ZERO WIDTH JOINER(U + 200D):鼓励结扎和草书连接。
问题:我是否可以使用UNICODE空格字符来保持两个图像彼此内联,否则它们会突破到新行?
测试:http://codepen.io/dcdev/pen/LEOMLP
结果:不,你不能。
答案 2 :(得分:9)
尝试使用css属性white-space: nowrap;
包装图片:
<span style="white-space: nowrap;"><img ...><img ...></span>
答案 3 :(得分:1)
您可以访问此网站:Symbols - 它可以轻松访问许多特殊符号和字符。在页面底部,您会看到“零宽度空间”字符的按钮,只需单击该按钮即可在剪贴板中复制“零宽度空间”字符。