是否可以隐藏第一个字母后面的所有字母与CSS？
dt:not(::first-letter) {
display: none;
}
解决方法
你可以，但你的CSS是错误的。以下版本适用(至少在Chrome中)。它使dt不可见，并定义了第一个字母的覆盖，使其再次可见。
我尝试了同样的显示太，但这不工作，如预期。 visibility：hidden隐藏内容，但保持元素在位置，而display：none从流中删除它，并且使子元素(在这种情况下，第一个字母)不可能再次可见。
我添加了一个悬停，所以你可以悬停信，看到dt的其余部分。
dt {
visibility: hidden;
}
dt::first-letter {
visibility: visible;
}
/* Hover the first letter to see the rest */
dt:hover {
visibility: visible;
}
Hover to see the rest: <dt>Lorum ipsum is a weird text</dt> <dt>Foo bar</dt>
副作用将是文本所覆盖的区域仍被要求保护。也许这不是一个问题，但如果是你将需要一些其他的解决方案。一种可能性是使dt 0的字体大小。这样，文本是如此之小，以至于声明没有空间。如果它也包含图像，当然不会帮助。
由于它似乎不工作，这里是替代使用字体大小。不太理想，但希望它仍然可以解决你的问题。
dt {
font-size: 0;
}
dt::first-letter {
font-size: 1rem;
}
/* Hover the first letter to see the rest */
dt:hover {
font-size: 1em;
}
Hover to see the rest: <dt>Lorum ipsum is a weird text</dt> <dt>Foo bar</dt>
