<div class='slide-show-container'>
<!--<div class='slide-show-image-container fl image-current-slide'>-->
<!--<img class='slide-show-image' src='assets/images/index_slide_01.png'>-->
<!--</div>-->
<!--<div class='slide-show-image-container fl'>-->
<!--<img class='slide-show-image' src='assets/images/index_slide_02.png'>-->
<!--</div>-->
<!--<div class='slide-show-image-container fl'>-->
<!--<img class='slide-show-image' src='assets/images/index_slide_03.png'>-->
<!--</div>-->
<ul>
<!-- 用户可能一开始往上一张滑,所以要多添加一个focus3 -->
<li>
<img class='slide-show-image' src="assets/images/index_slide_03.png" alt="心里只有你生活网">
</li>
<li>
<img class='slide-show-image' src="assets/images/index_slide_01.png" alt="心里只有你生活网">
</li>
<li>
<img class='slide-show-image' src="assets/images/index_slide_02.png" alt="心里只有你生活网">
</li>
<li>
<img class='slide-show-image' src="assets/images/index_slide_03.png" alt="心里只有你生活网">
</li>
<li>
<img class='slide-show-image' src="assets/images/index_slide_01.png" alt="心里只有你生活网">
</li>
</ul>
<ol>
<li class="current"></li><li class='ml5'></li><li class='ml5'></li>
</ol>
</div>
/* 首页轮播样式 */
.slide-show-container {
/*height: 7rem;*/
height: 150px;
/*background: maroon;*/
overflow: hidden;
/*display: flex;*/
/*flex-direction: row;*/
position: relative;
}
.slide-show-container ul {
width: 500%;
overflow: hidden;
margin-left: -100%;
height: 100%;
}
.slide-show-container ul li {
float: left;
width: 20%;
height: 100%;
}
.slide-show-container ol {
position: absolute;
/*bottom: 5px;*/
/*right: 5px;*/
bottom: 5px;
left: 50%;
/*background: deeppink;*/
margin-left: -18px;
}
.slide-show-container ol li {
width: 5px;
height: 5px;
display: inline-block;
/*background-color: #fff;*/
background-color: #E3D9D9;
border-radius: 5px;
transition: all .2s;
list-style: none;
margin:0;
padding:0;
margin-left: 5px;
}
.slide-show-container .current {
width: 16px;
border-radius: 5px;
}
.slide-show-image-container {
height: 100%;
width: 100%;
/*display: none;*/
}
.index-message-type-options-container {
width: 100%;
/*height: 20px;*/
background: #ffffff;
margin-bottom: 10px;
box-sizing: border-box;
/*padding-left: 9pt;*/
/*padding-right: 9pt;*/
}
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…