我正在分析一个 html 页面,其中 div 的文本到处都包含一个不属于一系列空白字符的空白,即单词之间的单个空白,< em>不是一系列空白 - 空白不会出现在页面的浏览器显示中。每个 div 的单词只显示为一个长单词,而不是像源代码中那样通常由空格分隔。
我知道有一些 css 样式可以控制连续多个空格的抑制,但找不到任何可能导致这种从显示中排除的行为,即使是单个空格也不显示。任何指向正确方向的指针都将不胜感激。
最新版本的 Chrome 不是一些旧浏览器.....
为示例 div 显示的计算样式(包括继承样式)是:
-webkit-text-stroke-color: rgba(0, 0, 0, 0);
-webkit-text-stroke-width: 0.5977559685707092px;
-webkit-transform: matrix(0.25, 0, 0, 0.25, 0, 0);
-webkit-transform-origin: 0px 29.0078125px;
border-collapse: separate;
bottom: 294.40631103515625px;
color: rgb(0, 0, 0);
display: block;
font-family: ff1;
font-size: 40px;
font-style: normal;
font-weight: normal;
height: 29.0078125px;
left: 54.198307037353516px;
letter-spacing: normal;
line-height: 18.5px;
position: absolute;
text-shadow: none;
unicode-bidi: bidi-override;
visibility: visible;
white-space: pre;
width: 913.8046875px;
word-spacing: 0px;
最佳答案
除了影响是否显示各种 html 元素内的空白的许多其他因素(如果我有时间,我将在随后的编辑中对它们进行总结),可能 抑制的一件事 显示的 html 中包含的空白是应用于 html 的字体中的空白字符的字形。如果该字形使得空白字符根本不占用任何空间,或者宽度很小,那么 html 中包含的空白字符将在显示中有效消失。
某些自定义字体可能就是这种情况,了解这些情况会很有帮助。
我非常感谢所有为这个问题贡献知识的人,他们都非常相关并且涵盖了这个主题。
关于html - 抑制 html 和字形宽度中的单个空白字符,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20671637/