4-5编程我边框设置有问题吧?

4-5编程我边框设置有问题吧?

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>display属性</title>
        <style type="text/css">
          /*样式补充*/
          ul li{list-style: none;}
          *{
            margin: 0px;
            padding: 0px;}
          .big{
            text-align: center;
            margin: 0px auto;
            width: 80px;}
          h3{background-color: #c0c0c0;
            border:1px black solid;}
          .elec,.wash,.clothes{
            border: 1px black solid;
            display: none;}
          .div1:hover .elec,
          .div2:hover .wash,
          .div3:hover .clothes{display: block;}
          
        </style>
    </head>
    <body>
    <div class="big">
        <div class="div1">
            <h3>家电</h3>
            <ul class="elec">
                <li>冰箱</li>
                <li>洗衣机</li>
                <li>空调</li>
            </ul>
        </div>
        <div class="div2">
            <h3>洗护</h3>
            <ul class="wash">
                <li>洗衣液</li>
                <li>消毒液</li>
                <li>柔顺剂</li>
            </ul>
        </div>
        <div  class="div3">
            <h3>衣物</h3>
             <ul class="clothes">
                <li>衬衫</li>
                <li>裤子</li>
                <li>卫衣</li>
            </ul>
        </div>
      </div>
</body>
</html>


正在回答

登陆购买课程后可参与讨论,去登陆

3回答

如果要是真的想去除的话,只能一个一个的来去除了,参考代码:

http://img1.sycdn.imooc.com//climg/5a98f7200001de0f05560325.jpg

http://img1.sycdn.imooc.com//climg/5a98f74a0001342203640242.jpg

自己可以测试一下哦!

  • Llawliet丶 提问者 #1
    wow,非常感谢
    2018-03-02 15:10:45
慕哥7428920 2018-03-10 16:07:45

先给.big{border:1px black solid;}设置整个边框,再给标题h3{border-bottom:1px black solid;}设置下边框,再给ul{border-top:1px black solid;}再给隐藏框设置一条上边框。

好帮手慕星星 2018-03-02 14:45:45

测试之后效果是没有问题的,边框指的是中间加粗的吗?

http://img1.sycdn.imooc.com//climg/5a98f2dc000118c401480119.jpg

这个是因为上一个下边框和下一个上边框重叠了,所以会加粗加深,没有关系。

祝学习愉快!~~

  • 提问者 Llawliet丶 #1
    我的意思就是这个地方上下重叠加粗了,该怎么改一下呢?
    2018-03-02 14:47:30
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
前端小白入门系列课程
  • 参与学习           人
  • 提交作业       11218    份
  • 解答问题       36713    个

从一个不会编程的小白到一个老司机是需要过程的,首先得入门,学习基础知识,然后才能进阶,最后再到精通,本专题是你走进前端世界的不二选择!

了解课程
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师