如何使用“文本转换：大写”而不影响全部大写单词？

覆盖 CSS 文本转换：所有大写文本大写

问题：

利用 CSS 的文本转换：大写;当这些单词的首字母本质上需要大写时，例如专有名词或首字母缩略词，将全大写文本转换为句子大小写的规则会出现问题。

如以下代码片段所示，“Small”的所需输出大写字母和全部大写字母”不是实现：

HTML：

<a href="#" class="link">small caps</a> &amp; 
<a href="#" class="link">ALL CAPS</a>

CSS：

.link {text-transform: capitalize;}

结果：

Small Caps & ALL CAPS

解决方案：

至在保持文本转换的同时实现所需的大写行为：大写；规则，可以实现以下 CSS：

.link {
  text-transform: lowercase;
}
.link:first-letter,
.link:first-line {
  text-transform: uppercase;
}

此修改首先将所有文本转换为小写，然后将每个单词的第一个字母和文本的第一行重新大写。

结果：

Small Caps
All Caps

以上是如何使用“文本转换：大写”而不影响全部大写单词？的详细内容。更多信息请关注PHP中文网其他相关文章！