问答详情
源自:10-1 编程挑战

帮忙看一下active类为什么没有效果,设置的是<li>上边框变红,下边框变白,但是没变。

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>选项卡</title>

<style type="text/css">

*{

   margin:0px;

   padding:0px;

   font-style:normal;

   font-size:12px;

   font-family:"微软雅黑";

   color:#000000

}

a{

   text-decoration: none;

}

ul{

   list-style-type:none;

}

#ul1{

   border-bottom:2px solid #630505;

   height:30px;

}

#div1{

   width:275px;

   height:190px;

   margin:20px auto;

}

#ul1 li{

   display:inline-block;

   width:60px;

   height:30px;

   margin-left:5px;

   border:1px solid #A4D6F3;

   border-bottom:none;

   text-align:center;

   line-height:30px

}

#ul1 li:hover{cursor:pointer};

#ul1 li.active{

   border-top:2px solid #630505;

   border-bottom:2px solid #ffffff;

}

#div1 div{

   border:1px solid #2252F0;

   border-top:none;

}

#div div li{

   height:32px;

   line-height:30px;

   text-indent:8px;

}

.show{

   display:block;

}

.hide{

   display:none;

}

</style>

<script type="text/javascript">

</script>

</head>

<body>

   <div id="div1">

       <ul id="ul1">

           <li class="active">房产</li><li>家居</li><li>二手房</li>

       </ul>

       <div>

           <ul class="show">

               <li>275万购昌平邻铁三居 总价20万买一居</li>

               <li>200万内购五环三居 140万安家东三环</li>

               <li>北京首现零首付楼盘 53万购东5环50平</li>

               <li>京楼盘直降5000 中信府 公园楼王现房</li>

           </ul>

           <ul class="hide">

               <li>40平出租屋大改造 美少女的混搭小窝</li>

               <li>经典清新简欧爱家 90平老房焕发新生</li>

               <li>新中式的酷色温情 66平撞色活泼家居</li>

               <li>瓷砖就像选好老婆 卫生间烟道的设计</li>

           </ul>

           <ul class="hide">

               <li>通州豪华3居260万 二环稀缺2居250w甩</li>

               <li>西3环通透2居290万 130万2居限量抢购</li>

               <li>黄城根小学学区仅260万 121平70万抛!</li>

               <li> 独家别墅280万 苏州桥2居优惠价248万</li>

           </ul>

       </div>

   </div>

</body>

</html>


提问者:风起临冬 2018-08-07 09:26

个回答

  • qq_风吹一个小月亮_0
    2018-08-07 14:08:53

    选择器优先级了解一下