大学生就可以看懂的css基础知识系列，pre标签里是笔记总结，动手实际操作一下会加强理解。有疑问留言交流哦。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.font1 {
color: red;
font-size: 18px;
font-family: "Times New Roman";
font-style: normal;
direction: ltr;
letter-spacing: 1px;
/*word-spacing: 3px;*/
text-align: left;
vertical-align: center;
line-height: 20px;
margin-top: 5em;
margin-left: 5em;
background-color: bisque;
margin-right: 5em;
}
.font1:before {
content: "---";
float: right;
margin-top: -12px;
}
.font1:after {
content: "---";
float: right;
margin-top: -12px;
}
.bg1 {
content: "font1";
background-image: url("pics/1.png");
background-repeat: repeat-y;
border-left-color: #333333;
border-left-width: 1px;
}
</style>
</head>
<body>
<pre class="bg1 font1" style="height: 100%">
font相关属性
font-size: 18px;
font-family: "Times New Roman";
font-style: normal;
text相关
direction:
ltr:左到右
rtl:右到左
text-align: center;
水平居中对齐
组件内文本垂直对齐:
line-height=外部组件的高度 div下 line-height: 300px;=style中的height.pre标签比较特殊不能验证.需要用div.
</pre>
</body>
</html>