使第一个字符在CSS大写

在CSS中是否有一种方法使标签中的第一个字符< em >大写< / em >

这是我的HTML:

<a class="m_title" href="">gorr</a>
<a class="m_title" href="">trro</a>
<a class="m_title" href="">krro</a>
<a class="m_title" href="">yrro</a>
<a class="m_title" href="">gwwr</a>

498312 次浏览

CSS:首字母选择器

或者:

text-transform: capitalize;

这里有一个属性:

a.m_title {
text-transform: capitalize;
}

如果你的链接可以包含多个单词,并且你只希望第一个单词的第一个字母是大写的,那么使用:first-letter来代替一个不同的转换(尽管这并不重要)。注意,为了让:first-letter工作,你的a元素需要是块容器(可以是display: blockdisplay: inline-block,或一个或多个属性的任何其他组合):

a.m_title {
display: block;
}


a.m_title:first-letter {
text-transform: uppercase;
}

我建议使用

#selector {
text-transform: capitalize;
}

#selector::first-letter {
text-transform: uppercase;
}

顺便说一下,检查这个w3schools链接:http://www.w3schools.com/cssref/pr_text_text-transform.asp

注意,::first-letter选择器不适用于内联元素,因此它必须是blockinline-block,如下所示:

.m_title {display:inline-block}
.m_title:first-letter {text-transform: uppercase}

我建议你在CSS中使用以下代码:

    text-transform:uppercase;

确保你把它放在你的课上。

<script type="text/javascript">
$(document).ready(function() {
var asdf = $('.capsf').text();


$('.capsf').text(asdf.toLowerCase());
});
</script>
<div style="text-transform: capitalize;"  class="capsf">sd GJHGJ GJHgjh gh hghhjk ku</div>

先写小写字母:

.m_title {text-transform: lowercase}

然后把第一个字母大写:

.m_title:first-letter {text-transform: uppercase}

“首字母:capitalize"为一个词工作;但如果你想用在句子中,这个解决方案是完美的。

< >强的例子:

.m_title {
display: inline-block; /* Thanks to Fanky (https://stackoverflow.com/users/2095642/fanky) */
  

text-transform: lowercase
}


.m_title:first-letter {
text-transform: uppercase
}
<a class="m_title" href="">gorr</a>
<a class="m_title" href="">trro</a>
<a class="m_title" href="">krro</a>
<a class="m_title" href="">yrro</a>
<a class="m_title" href="">gwwr</a>

也适用于React Native:

    textTransform: 'capitalize'