您的位置：首页 > Web前端 > HTML

html学习笔记(2)-字母大小写转换练习

2015-01-31 21:59 344 查看
主要应用了text-transform属性值：

uppercase：所有单词的字母都大写；

lowercase：所有单词的字母都小写；

capitalize：每个单词的首字母都大写；

none：默认值显示；

<head runat="server">
<title>应用text-transform属性</title>
<style type="text/css">
h2
{
font-family: 黑体;
font-size: 18pt;
text-align: center;
}
.p1
{
font-size: 15px;
text-transform: uppercase;
}
.p2
{
font-size: 15px;
text-transform:lowercase;
}
.p3
{
font-size: 15px;
text-transform:capitalize;
}
.p4
{
font-size: 15px;
text-transform:none;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<h2>
转换英文大小写</h2>
<p class="p1">
Welcome to China......所有单词的字母都大写</p>
<p class="p2">
Welcome to China......所有单词的字母都小写</p>
<p class="p3">
Welcome to China......所有单词的字母首字母都大写</p>
<p class="p4">
Welcome to China......默认值</p>
</div>
</form>
</body>


View Code

效果图：

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航