为什么JS中轮播图中，我写关于按钮样式时，按钮不会显示？

Question

    <div class="way" id="way">    <div class="banner" id="banner">    <a href="">    <div class="banner-slide slide1 slide-action">    </a>    <a href="">    <div class="banner-slide slide2">    </a>    <a href="">    <div class="banner-slide slide3">    </a>    <a href="">    <div class="banner-slide slide4">    </a>    </div>    <a href="javascript:(0)" class="button prev" id="prev"></a>    <a href="javascript:(0)" class="button next" id="next"></a>    </div></body></html>CSS：.way{ width:1200px; height: 460px; margin:0 auto; overflow: hidden; position: relative;}.banner{ width:1200px; height:460px; overflow: hidden; position: relative;}.banner-slide{ width:1200px; height:460px; position: absolute; background-repeat: no-repeat; display:none;}.slide-action{display: block;}.slide1{background-image: url("../img/ban1.png");}.slide2{background-image: url("../img/ban2.jpg");}.slide3{background-image: url("../img/ban3.png");}.slide4{background-image: url("../img/ban4.jpeg");}.button{    position: absolute;    top: 50%;    left: 0px;    height: 80px;    width: 40px;    margin-top:-40px;    background:url(../img/arrow.png) no-repeat center center;}.button:hover{ background-color: #333; opacity:0.8; filter: alpha(opacity=80);}.prev{transform: rotate(180deg);}.next{ left:auto; right: 0;}

Answer 1

<a href="">
    <div class="banner-slide slide1 slide-action"></div>
</a>
<a href="">
    <div class="banner-slide slide2"></div>
</a>
<a href="">
    <div class="banner-slide slide3"></div>
</a>
<a href="">
    <div class="banner-slide slide4"></div>
</a>

你的DIV都没的结束呀，就是少了 </div>。你不结束，浏览器就会按它猜的帮你结束，可惜它猜错了。自己打开浏览器控制台，看看它帮你生成的结构是不是你想的。