* {
margin:0;
padding:0;
}
#nav {
position:fixed;
left:30px;
top:10px;
}
#nav li {
width:50px;
height:30px;
font:bold 20px/30px simhei;
text-align:center;
list-style-type:none;
background:#333;
color:#fff;
margin:10px 0;
cursor:pointer;
}
#list {
width:470px;
overflow:hidden;
margin-left:200px;
}
#list li {
width:470px;
height:300px;
text-align:center;
font:bold 100px/300px simhei;
list-style-type:none;
background:yellow;
color:blue;
/* margin:50px 200px;
*/
margin-bottom:50px;
}
.blue {
background-color:blue !important;
color:#fff !important;
}
.undfand {
background-color:#fff !important;
}
.top {
position:fixed;
right:0;
bottom:0;
width:50px;
height:50px;
background-color:pink;
cursor:pointer;
}
#list #go1 {
position:relative;
height:300px;
}
#go1 div {
float:left;
width:470px;
height:100%;
background-color:orange;
margin-right:10px;
}
.btn {
position:absolute;
width:546px;
height:50px;
top:130px;
left:160px;
}
.btn button {
width:30px;
height:40px;
}
.fl {
float:left;
}
.fr {
float:right;
}
更新时间:2019-08-13 23:13:35
需要jq的2.2.0以上的版本才可以运行 页面刚进去轮播图父盒子的宽度就已经计算出来了 所以宽度是动态的 因为咱们在日常工作总轮播图是后台数据遍历出来的 所以宽度是动态算出来的 左导航方法比较笨不过很容易看懂 代码都很简单新手看四五分钟就懂了