html图片在左侧输出,当我鼠标移到小图片的时候，左侧显示大图片。怎么用CSS样式代码写出来。求指导...

html>

.containter{

border: 1px solid #aaa;

position: relative;

width: 420px;

height: 300px;

overflow:hidden;

box-sizing: border-box;

list-style:none;

}

.small-img, .big-img{

background-repeat: no-repeat;

background-size: cover;

background-position:center;

}

.small-img{

width: 120px;

height: 60px;

float:right;

border:1px solid #ddd;

border-top:0;

clear:both;

box-sizing: border-box;

}

.big-img{

position:absolute;

top: 0;

left: 0;

width: 300px;

height: 300px;

display:none;

box-sizing: border-box;

border: 20px solid #fff;

}

.small-img:hover .big-img, .default-img{

display:block;

}