text-transform属性定义
简单的说就是控制文本大小写的
text-transform属性值
none 默认。定义带有小写字母和大写字母的标准的文本。
capitalize 文本中的每个单词以大写字母开头。
uppercase 定义仅有大写字母。
lowercase 定义无大写字母,仅有小写字母。
inherit 规定应该从父元素继承 text-transform 属性的值。
代码实现过程
<!DOCTYPE html>
<html>
<head>
<title>css教程</title>
<style type="text/css">
.transform{
text-transform: capitalize;
}
.transform1{
text-transform: uppercase;
}
.transform2{
text-transform: lowercase;
}
.transform3{
text-transform: uppercase;
}
.transform4{
text-transform: inherit;
}
</style>
</head>
<body>
<div class="transform">
this is a css, it`s very much
</div>
<div class="transform1">
This IS a css, it`s very much
</div>
<div class="transform2">
This is a css, it`s very much
</div>
<div class="transform3">
This is a css, it`s very much
<div class="transform4">
This is a css, it`s very mucH
</div>
</div>
</body>
</html>
实现效果如下

注意事项
1 本属性一般用于英文,对于形如css-html,浏览器会默认是两个单词text-decoration属性定义
text-decoration属性在中文字体中用的还是比较多的,当然英文中也是经常用到,主要是用于文本修饰。text-decoration属性值
none 默认。定义标准的文本。 underline 定义文本下的一条线。 overline 定义文本上的一条线。 line-through 定义穿过文本下的一条线。 blink 定义闪烁的文本。 inherit 规定应该从父元素继承 text-decoration 属性的值。 代码实现过程
<!DOCTYPE html>
<html>
<head>
<title>css教程</title>
<style type="text/css">
.decoration{
text-decoration:overline ;
}
.decoration1{
text-decoration: underline;
}
.decoration2{
text-decoration:line-through;
}
.decoration3{
text-decoration: blink;
}
.decoration4{
text-decoration: inherit;
}
</style>
</head>
<body>
<div class="decoration">
this-css is a css, it`s very much
</div>
<div class="decoration1">
This IS a css, it`s very much
</div>
<div class="decoration2">
This is a css, it`s very much
</div>
<div class="decoration3">
This is a css, it`s very much
<div class="decoration4">
This is a css, it`s very mucH
</div>
</div>
</body>
</html>
实现效果

注意事项
1 有意思的是,text-decoration属性的值不会叠加,也就是说在同一个对象中添加多个属性值,不会同时出现两个。 如果想了解更多的css教程,请收藏本站 www.seojingxue.com顶一下
(0)
踩一下
(0)