虽然英文字母大小写转换听起来更像一个函数，应该属于javascript做的事情，或者后端处理的事情。
但是css 提供的text-transform 属性恰恰可以控制文本的大小写显示。
text-transform 属性可用于使文本显示为全小写或全大写，或者可以将每个单词的第一个字符转换为大写。
语法格式
text-transform: 函数; 函数值
函数值可以为
| 值 | 描述 |
|---|---|
| none | 默认。不转换。 |
| capitalize | 将每个单词的第一个字符转换为大写。 |
| uppercase | 将单词的所有字符转换为大写。 |
| lowercase | 它将单词的所有字符转换为小写。 |
| inherit | 规定应该从父元素继承 text-transform 属性的值。 |
例子
该属性更像一个javascript函数，所以可以看下每个属性值的用法，如下
<!DOCTYPE html>
<html>
<title>css text-transform 文字大小写转换例子</title>
<head>
<style>
.p1{
text-transform: capitalize;
color:orange;
}
.p2{
text-transform: uppercase;
color:blue;
}
.p3{
text-transform: lowercase;
color:pink;
}
</style>
</head>
<body>
<p class="p1">yxjc123.com 首字母大写</p>
<p class="p2">yxjc123.com 全部大写</p>
<p class="p3">YXJC123.com 全部小写</p>
</body>
</html>