* {
margin:0;
padding:0;
}
.container {
width:400px;
height:300px;
margin:30px auto;
position:relative;
}
.container ul li {
list-style:none;
display:none;
}
.container ul:first-child {
width:100%;
height:100%;
}
.container ul:first-child li {
width:100%;
height:100%;
float:left;
position:absolute;
top:10px;
}
.container ul li img {
width:100%;
height:100%;
}
.container .current {
display:block;
}
#circle {
position:absolute;
left:180px;
bottom:1px;
}
#circle li {
width:12px;
height:12px;
background-color:gray;
border-radius:50%;
margin:0px 4px;
display:inline-block;
cursor:pointer;
}
#circle .current1 {
background-color:coral;
}