#leftcolumn a{ /* ID为 leftcolumn 的 a链接 样式 */
display:block /* 变换a标签为块级元素,这样就可以设定宽高等属性了 */
color:#333333 /* a链接的颜色为 #333333 */
background-color:#d6d6d6 /* 背景颜色为 #d6d6d6 */
margin-bottom:2px /* 下外边距为2像素 */
padding:2px /* 内边距为2像素 */
text-decoration:none /* 链接无下划线 */
font-weight:bold} /* 字体为粗体 */
下面看效果
下面是代码
<!doctype html><html lang="en">
<head>
<meta charset="UTF-8">
<title>d</title>
<style>
* {
margin:0
padding: 0
}
#leftcolumn a {
display:block
color:#333333
background-color:#d6d6d6
margin-bottom:2px
padding:2px
text-decoration:none
font-weight:bold
}
</style>
</head>
<body>
<br/>
<div class="" id="leftcolumn"><a href="#">ID为leftcolumn的a标签</a></div>
</body>
</html>
id是页面中Div标签的ID,在一个网页中,具有唯一性(即:只能使用一次)class是div的样式类名,在一个网页中,可以使用多次。
但是,id的优先级要高于class的优先级。例如:
#test{height:30px}
.style{height:20px}
<div id="test" class="style"></div>
这个div的高度是30px,而不是20px