<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style>
body{
background-color: gray;
color: green;
}
#D01{
color: #800080;
}
#D02{
color: rgb(100,55,200);
}
#D03{
color: rgb(20%,60%,80%);
}
</style>
</head>
<body>
<div id="D01">
<span>01</span>
</div>
<div id="D02">
<span>02</span>
</div>
<div id="D03">
<span>03</span>
</div>
<div id="D04">
<span>04</span>
</div>
<div id="D05">
<span>05</span>
</div>
</html>
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1.文本颜色属性以color属性定义,其值可为颜色关键字,16进制,rgb颜色等,默认为黑色;
2.RGB(红,绿,蓝),可以是0~255之间的值,也可为0%~100%;
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style>
body{
background-color: gray;
text-align: left;
}
#D01{
text-align: center;
}
#D02{
text-align: right;
}
#D03{
text-align: justify;
}
</style>
</head>
<body>
<div id="D01">
<span>01</span>
</div>
<div id="D02">
<span>02</span>
</div>
<div id="D03">
<span>03</span>
</div>
<div id="D04">
<span>04</span>
</div>
<div id="D05">
<span>05</span>
</div>
</html>
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1.文本对齐方式以属性text-align属性定义,默认为左对齐;
2.当text-align设置为adjust时,每一行被展开为宽度相等，左，右外边距是对齐（如杂志和报纸）
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style>
body{
background-color: gray;
text-decoration: none;
}
#D01{
text-decoration: overline;
}
#D02{
text-decoration: underline;
}
#D03{
text-decoration: line-through;
}
</style>
</head>
<body>
<div id="D01">
<span>01</span>
</div>
<div id="D02">
<span>02</span>
</div>
<div id="D03">
<span>03</span>
</div>
<div id="D04">
<span>04</span>
</div>
<div id="D05">
<span>05</span>
</div>
</html>
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1.下划线以text-decoration定义,默认为none;
2.下划线常用来表示链接,其他文本不建议使用,以避免混淆
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style>
body{
background-color: gray;
text-transform: none;
}
#D01{
text-transform: lowercase;
}
#D02{
text-transform: uppercase;
}
#D03,#D04,#D05{
text-transform: capitalize;
}
</style>
</head>
<body>
<div id="D01">
<span>Abc01</span>
</div>
<div id="D02">
<span>aBC02</span>
</div>
<div id="D03">
<span>abC03</span>
</div>
<div id="D04">
<span>abc04</span>
</div>
<div id="D05">
<span>ABC05</span>
</div>
</html>
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1.文本大小写转换,以属性text-transform属性定义,默认为none;
2.常用属性有全部大写,全部小写,首字母大写
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style>
body{
background-color: gray;
text-indent: 2em;
}
#D01{
text-indent: 0;
}
#D02{
text-indent: 16px;
}
#D03{
text-indent: 10%;
}
#D04{
text-indent: 50%;
}
</style>
</head>
<body>
<div id="D01">
<span>Abc01</span>
</div>
<div id="D02">
<span>aBC02</span>
</div>
<div id="D03">
<span>abC03</span>
</div>
<div id="D04">
<span>abc04</span>
</div>
<div id="D05">
<span>旅行和旅游的区别就在于：旅行是在观察身边的景色和事物，行万里路，读万卷书，相对于是指个人，是行走。旅游是指游玩，通常是团体出行，在时间上是很短暂的。旅游就是旅行游览活动。它是一种复杂的社会现象，旅行要涉及到社会的政治、经济、文化、历史、地理、法律等各个社会领域。旅游也是一种娱乐活动，任何去外地游玩都可以算。世界旅游组织指旅行的定义是某人出外最少离家55英里（88.5千米）</span>
</div>
</html>
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1.首行缩进以text-indent属性定义,默认为0;
2.首行缩进可以为绝对大小px,百分比%,相对大小em定义
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style>
body{
background-color: gray;
letter-spacing: normal;
}
#D01{
letter-spacing: 2rem;
}
#D02{
letter-spacing: 0;
}
#D03{
letter-spacing: 16px;
}
</style>
</head>
<body>
<div id="D01">
<span>Abc01</span>
</div>
<div id="D02">
<span>aBC02</span>
</div>
<div id="D03">
<span>abC03</span>
</div>
<div id="D04">
<span>abc04</span>
</div>
<div id="D05">
<span>旅行和旅游的区别就在于：旅行是在观察身边的景色和事物，行万里路，读万卷书，相对于是指个人，是行走。旅游是指游玩，通常是团体出行，在时间上是很短暂的。旅游就是旅行游览活动。它是一种复杂的社会现象，旅行要涉及到社会的政治、经济、文化、历史、地理、法律等各个社会领域。旅游也是一种娱乐活动，任何去外地游玩都可以算。世界旅游组织指旅行的定义是某人出外最少离家55英里（88.5千米）</span>
</div>
</html>
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1.字间距以letter-spacing属性定义,默认为normal;
