HTML用css把英文字母改大,CSS转换英文大小写text-transform属性

本文介绍了CSS中的text-transform属性,用于转换英文文本的大小写。通过none、lowercase、uppercase和capitalize四个取值,可以实现原始值、全小写、全大写以及首字母大写的转换效果。在网页设计中,这一功能对于统一文本格式和提升可读性至关重要。
摘要由CSDN通过智能技术生成

【实例介绍】

CSS转换英文大小写text-transform

英文字母大小写转换是CSS提供的很实用的功能,只需要设置英文段落的text-transfrom属性,就可以用来转换英文字母的大小写。

【基本语法】

text-transform:转换值

【语法介绍】

text-transform包括以下取值范围。

none:表示使用原始值。

lowercase:表示使每个词的所有字母小写。

uppercase:表示使每个单词的所有字母大写。

capitalize:表示使每个单词的第一个字母大写。

【实例代码】

无标题文档

.CSS { font-family: Arial;

font-size: 20px;

text-transform: uppercase;

}

.CSS1 { font-family: Arial;

font-size: 20px;

text-transform: lowercase;

}

.CSS2 { font-family: Arial;

font-size: 20px;

text-transform: capitalize;

}

.CSS3 { font-family: Arial;

font-size: 20px;

text-transform: none;

}

good-morning

good-morning

good-morning

good-morning

【代码分析】

在代码中,加粗的标记中定义了4种样式,text-transform属性分别设置为uppercase(所有字母大写)、

lowercase(所有字母小写)、capitalize(第一个字母大写)、none(原始值),在浏览中预览效果,如图所示。

d53ae401231508c3a27fc4b8942e32d6.png

【素材及源码下载】

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值