.appendix-pic,.box-pic { float: left; } .append-pic { width: 50px; height: 50px; background-color: #fff; position: relative; margin-bottom: 10px; float: left; margin-left: 10px; } .append-pic span.del-pic { display: block; position: absolute; color: #fff; top: 0px; right: 0px; width: 18px; height: 18px; font-size: 14px; line-height: 16px; border-radius: 9px; background-color: rgba(153, 153, 153, 0.6); text-align: center; opacity: 0; cursor: pointer; -ms-transition: background-color 100ms; -moz-transition: background-color 100ms; -webkit-transition: background-color 100ms; transition: background-color 100ms; } .append-pic:hover span.del-pic { opacity: 1; } .append-pic span.del-pic:hover { background-color: #000; opacity: 1; } img.append_img { width: 50px; height: 50px; display: inline-block; border: 1px dashed #ddd; } .product-pic, .add_pro_pic { overflow: hidden; float: left; margin-right: 10px; } .add_pic { display: block; width: 50px; height: 50px; border: 1px dotted #cfcfd1; cursor: pointer; background: url(images/add_pic.png) no-repeat #f9fafb; background-size: contain; float: left; } .add_pic:hover { background: url(images/add_pic_hover.png) no-repeat #e6e7e8; border: 1px dashed #c5c5c7; background-size: contain; }