<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
/*样式重置*/
*{
margin: 0; /*外边距设置为0*/
padding: 0; /*内边距设置为0*/
}
.box{
/*设置显示区的大小,要注意必须与一张图片的大小保持一致;*/
width: 200px;
height: 200px;
margin:200px 0 0 400px; /*调整轮播图的位置*/
overflow:hidden; /*超出一张图片大小范围的内容全部隐藏起来*/
}
ul{
width: 600px; /*设置为600px的目的就是让三张图片能够有足够的空间来同行显示*/
list-style: none; /*清除项目符号*/
}
li{ /*让所有的图片同行显示*/
float: left;
}
</style>
</head>