当我分别在css中的p选择器中设置font-size:12px;和p a选择器设置font-size:12px;时，p标签的高度改变，外边距也发生了改变，这是为什么？
这是html代码：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>家用电器分类</title>
<link href="css/type.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="type">
<div id="title">家用电器</div>
<div class="secondTitle"><a href="#">大家电</a></div>
<p><a href="#">平板电视</a> <a href="#">洗衣机</a> <a href="#">冰箱</a><br/>
<span> </span><a href="#">空调</a> <a href="#">烟机/灶具</a> <a href="#">热水器</a><br/>
<span> </span><a href="#">冷柜/酒柜</a> <a href="#">消毒柜</a> <a href="#">家庭影院</a></p>
</div>
</body>
</html>
这是css代码：
@charset "gb2312";
/* CSS Document */
#type {
width:800px;
}
#title {
font-size:18px;
text-indent:1em;
background-color:#0f7cbf;
line-height:35px;
color:#FFF;
font-weight:bold;
}
.secondTitle {
background-color:#e4f1fa;
text-indent:2em;
font-size:14px;
line-height:30px;
font-weight:bold;
}
.secondTitle a {
color:#0f7cbf;
text-decoration:none;
}
.secondTitle a:hover {
text-decoration:underline;
}
p {
line-height:20px;
text-indent:1em;
}
p a {
font-size:12px;
color:#666666;
text-decoration:none;
}
p a:hover {
color:#F60;
text-decoration:underline;
}