<div class="user-three-column">
<ul>
<li class="user-three-column-new">
<a href="http://mall.jd.com/view_search-53194-0-1-1-24-1.html" target="_blank" title="">NEW ARRIVE新品上市</a>
</li>
<li class="user-three-column-hot">
<a href="http://mall.jd.com/view_search-53194-0-5-1-24-1.html" target="_blank" title="">HOT SALE 热卖推荐</a>
</li>
<li class="user-three-column-good">
<a href="http://mall.jd.com/view_search-53194-0-3-1-24-1.html" target="_blank" title="">GOOD RATE 好评推行</a>
</li>
</ul>
</div>.user-three- column {
.user-three-column {width: 990px;
height: 170px;
margin: 0 auto;
padding: 0;
background: url(http://img10.360buyimg.com/imgzone/g12/M00/06/1E/rBEQYVGVlEoIAAAAAAAeguos_6YAABWxAAZgrMAAB6a641.png) no-repeat 0 0;
}
.user-three-column ul {
list-style: none;
margin: 0;
padding: 0;
overflow: hidden;
}
.user-three-column li {
float: left;
display: inline;
width: 310px;
height: 121px;
margin: 15px 0 0 15px;
}
.user-three-column a {
display: block;
width: 100%;
height: 100%;
text-indent: -9999px;
overflow: hidden;
background: url(http://img10.360buyimg.com/imgzone/g12/M00/07/00/rBEQYVGVtu0IAAAAAAC4epKrcsMAABXxAIbx0sAALiS597.png) no-repeat 0 0;
}
.user-three-column .user-three-column-new a:hover {
background-position: -310px 0;
}
.user-three-column .user-three-column-hot a {
background-position: 0 -121px;
}
.user-three-column .user-three-column-hot a:hover {
background-position: -310px -121px;
}
.user-three-column .user-three-column-good a {
background-position: 0 -242px;
}
.user-three-column .user-three-column-good a:hover {
background-position: -310px -242px;
}