html - 抑制 html 和字形宽度中的单个空白字符

标签 html css

我正在分析一个 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/

相关文章:

javascript - 如何识别 Canvas 上绘制的矩形上的单击

html - 可见性隐藏删除表格中的背景颜色

jquery - ASP.NET - Bootstrap 下拉导航仅在根页面上工作

javascript - 通过javascript删除重复元素

javascript - 有什么方法可以在不完全重新处理/重新编码的情况下为我的迷宫添加边界?

html - CSS 显示正确但在刷新之前不正确, float 问题

html - 标志星在某些浏览器上显示乱序

html - 如何使用 CSS 内联元素

php - jQuery 正在剥离 HTML,我不知道为什么

html - 如果提交的表单包含验证错误,我是否应该返回 400 错误?