Untitled

<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 {

  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;

}