行高：
CSS中所有的行，都有行高。盒模型padding不是直接作用在文字上的，而是作用在行上的。
文字是在自己的行里面居中的，比如文字字号是14px，行高是24px，那么文字上下的距离各为5px。
为了严格保证字在行里面居中，行高和字号一般都是偶数。这样它们的差就是偶数，能被2整除。
单行文本垂直居中：
文本在行里面居中
公式：行高=盒子高，所以这行文本就在盒子里面垂直居中
p{
width: 600px;
height: 60px;
background-color: yellow;
margin: 100px;
line-height: 60px;
text-align: center;
}但是这个小技巧只适用于单行文本垂直居中，不适用于多行。
如果想让多行文本垂直居中，需要设置盒子的padding：
p{
width: 600px;
height: 46px;
background-color: yellow;
margin: 100px;
font-size: 16px;
padding-top: 14px;
} p{
width: 600px;
height: 140px;
background-color: yellow;
margin: 100px;
font-size: 16px;
line-height: 20px;
padding-top: 60px;
}font属性：
使用font属性，能够一起设置字号、行高、字体：
font: 14px/24px “宋体”;
等价于三行语句：
font-size: 14px;
line-height: 24px;
font-family:"宋体";font-family就是“字体”，但不是所有字体都能用，因为这个字体要看用户的电脑里装没装。比如设置font-family:”华文彩云”;如果用户电脑里没有这个字体，那么就会变成宋体。
页面中，中文只使用：微软雅黑、宋体、黑体。如果页面中需要其他字体，那么需要切图。
英语：Arial、Times New Roman
为了防止用户电脑里面没有微软雅黑这个字体，那么就要用英语的逗号隔开备选字体，即如果用户电脑里面没有安装微软雅黑字体，那么就是宋体：font-family:”微软雅黑”, “宋体”;
备选字体有无数个，用逗号隔开。
我们要将英语字体放在最前面，这样所有的中文就不能匹配英语字体，就自动变为后面的中文字体：font-family:”Times New Roman”,”微软雅黑”,“宋体”；
所有的中文字体，都有英语别名：
微软雅黑的英语别名：
font-family:”Microsoft YaHei”;
宋体的英语别名：
font-family:”SimSun”;
font属性能够将font-size、line-height、font-family合三为一：
font: 12px/30px “Times New Roman”,”Microsoft YaHei”,”SimSun”;
行高可以用百分比，表示字号的百分之多少。一般来说都是大于100%，因为行高一定要大于字号。
font:12px/200%”宋体”;等价于font: 12px/24px”宋体”;
反过来，比如：
font: 16px/48px”宋体”;等价于font:16px/300%”宋体”;
超级链接的美化：即a标签
1. 伪类
同一个标签，根据用户的某种状态不同，有不同的样式，这就叫做伪类。
类是工程师加的，比如div属于box类，是明确的类。但是a属于什么类要看用户有没有点击，有没有触碰，所以叫做伪类。用冒号来表示。
a标签有4种伪类
<style type="text/css">
a:link{
color:red;
}
a:visited{
color:orange;
}
a:hover{
color:green;
}
a:active{
color:black;
}
</style>:link表示用户没有点击过这个链接的样式
:visited表示用户访问过了这个链接的样式
:hover表示用户鼠标悬停时候的样式
:active表示用户用鼠标点击过这个链接，但是未松开鼠标时的样子。
这四种状态在css中必须按照固定的顺序（如上）来写，如果不按照顺序将会失效。
2.超级链接的美化
a标签在使用时非常难，因为不仅要控制a这个盒子，也要控制它的伪类。
在使用时要将a标签写在前面，:link、:visited、:hover、:active这些伪类写在后面。
a标签中描述盒子；伪类中描述文字的样式、背景。
<style type="text/css">
*{
margin: 0;
padding: 0;
}
.nav{
width: 960px;
height: 40px;
border: 1px solid #000;
margin: 100px auto;
}
.nav ul{
list-style: none;
}
.nav ul li{
float: left;
width: 120px;
height: 40px;
background-color: lightpink;
text-align: center;
line-height: 40px;
}
.nav ul li a{
display: block;
width: 120px;
height: 40px;
}
.nav ul li a:link,.nav ul li a:visited{
text-decoration: none;
background-color: yellowgreen;
color:white;
}
.nav ul li a:hover{
background-color:red;
font-weight:bold;
color:yellow;
}
</style>
</head>
<body>
<div class="nav">
<ul>
<li><a href="#">网站</a></li>
<li><a href="#">网站</a></li>
<li><a href="#">网站</a></li>
<li><a href="#">网站</a></li>
<li><a href="#">网站</a></li>
<li><a href="#">网站</a></li>
<li><a href="#">网站</a></li>
<li><a href="#">网站</a></li>
<li><a href="#">网站</a></li>
</ul>
</div>
</body>所有的a不继承text、font，因为a自己有一个伪类的权重。
最标准的就是link、visited、hover都要写，但是前端工程师在大量实践中发现不写link、visited浏览器也能兼容，所以a标签也可以简化：
a:link、a:visited都是可以省略的，简写在a标签里面，也就是说a标签涵盖了link、visited状态。
.nav ul li a{
display: block;
width: 120px;
height: 40px;
text-decoration: none;
background-color: yellowgreen;
color:white;
}
.nav ul li a:hover{
background-color:red;
}