.clearfix {
  display: block;
}

.clearfix li {
  float: left;
  overflow: hidden;
  margin: 0 4px 4px 4px;
  width: 24%;
}

.clearfix li a {
  color: #8B8B8B;
}

.clearfix li a .li_img {
  border: 1px solid #dfdfdf;
  height: 152px;
  line-height: 147px;
  text-align: center;
  box-sizing: border-box;
}

.clearfix li a .li_img img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  vertical-align: middle;
}

.clearfix li a p {
  text-align: center;
  display: block;
  font: 14px "宋体";
  padding: 5px 0 0 0;
  width: 97%;
  height: 23px;
  line-height: 21px;
  margin: 0 auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  border-bottom: 1px solid #fff;
  box-sizing: border-box;
}

.clearfix li a:hover .li_img {
  border: 1px solid blue;
  box-sizing: border-box;
}

.clearfix li a:hover p {
  border-bottom: 1px solid #8B8B8B;
  box-sizing: border-box;
}