用display实现两种超链框

 display：block （将此元素显示为块级元素，此元素前后会带有换行符。）

display：none  (此元素不会被显示。)

display ：inline-block (行内块元素。)

display：list-item (此元素会作为列表显示。)

 

目前写过的两个例子：

 a {
	border: 1px solid #DBDBDB;
	display:inline-block;
	padding-top:3px;
	text-decoration:none;
	text-align:center;
	width:50px;
}

<a href="#">首页</a>&nbsp;&nbsp;
<a href="#">上一页</a>&nbsp;&nbsp;
<a href="#">下一页</a>&nbsp;&nbsp;
<a href="#">末页</a>

 

效果图：

 

 

 

 a{
	 display:block;
	 width:200px;
	 height:22px;
	 text-decoration:none;
	font-size: 12px;
	color:#999;
	text-decoration: none;
	padding-top:12px;
}

#bodyLeft a:hover{
	background-color:#F60;
	color:#FFF;
}	

 效果图：