所以我得到了一些 div,我将它们与 lettering.js 分开了.这只是将一个元素拆分为 <span>
。 s 包含单个字符。
当我得到一个包含多个单词的字符串,例如“Hello World!”时,lettering.js 将为单词之间的空格创建一个单独的跨度。该跨度没有宽度,因为它是“空的”→ 单词之间没有空格。
所以理论上我应该能够使用 span:blank
选择那些“空”跨度(并手动设置空格的宽度)因为 :blank 也会选择空格。
但这没有用。
所以我尝试使用 JavaScript,但还是失败了。
我尝试了几种方法:
$("span[class^='char']").each(function(){
// method 1:
this.innerHTML.trim();
// method 2:
$(this).text().trim();
// method 3:
$(this).text().replace(/\s/g, '');
// method 4:
$(this).text().replace(' ', '');
});
但是所有这些方法都失败了。
选择器不是问题。它会选择我想要的每个跨度。
另一种方法就是设置一个 min-width
对于每一个跨度,这都非常简陋,而且并不总是能很好地工作。
任何人都知道我如何获得那些“空”<span>
s 显示为空格?
Here's a link如果您想检查问题,请提供问题的实例。
更新:删除 display:inline-block
来自 span 元素使空间显示出来。我无法删除它,因为没有它变换动画将停止正常工作。
最佳答案
您可以使用 :empty 伪选择器并通过 CSS 中的内容添加空格;
span:empty{
content:' ';
display: inline-block;
}
<span>A</span>
<span></span>
<span>B</span>
关于javascript - 无法删除空格(在使用 lettering.js 拆分 div 之后),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57689603/