雨中徒步八英里 2019-09-05 23:58 采纳率: 0%
浏览 2016
已采纳

css设置dispay:none;后无法使用display:block;恢复显示

CSS部分代码如下:
初学前端,希望大佬指点一下下 - -

#list>ol>li>div{
    position: absolute;
    width: 990px;
    height: 460px;
    top: 0px;
    left: 202px;
    display: none;
}
#list>ol>li>div:hover img{
    display: block;/*想要让图片,在我放到盒子上时就显示出来*/
    /*先显示图片,再在这里使用none隐藏,可以成功隐藏图片*/
}

HTML部分代码如下

            <div id="list">
                    <ol>
                        <li>
                            手机&nbsp;&nbsp;电话卡
                            <div id="body_lefthidden_Img1">
                            <img src="这里是图片地址" />
                            </div>
                        </li>
                        <li>电视&nbsp;&nbsp;盒子</li>
                    </ol>
                </div>
  • 写回答

2条回答 默认 最新

  • 前端_小菜鸟 2019-09-06 10:08
    关注

    可以将这段代码

    #list>ol>li>div:hover img{
        display: block;/*想要让图片,在我放到盒子上时就显示出来*/
        /*先显示图片,再在这里使用none隐藏,可以成功隐藏图片*/
    }
    改成下面的
    #list>ol>li:hover div {
                display: block;
            }
    

    你本身就把图片包围的div 给了display:none 这时候你去 悬浮给div里面的img display:block是没有用的,因为它外层 父级都已经是display:none 所以要么你把悬浮的css写在img外层的div上,或者下面的代码这样

    #list>ol>li>div>img{
        position: absolute;
        width: 990px;
        height: 460px;
        top: 0px;
        left: 202px;
        display: none;
    }
    #list>ol>li>div:hover img{
        display: block;/*想要让图片,在我放到盒子上时就显示出来*/
        /*先显示图片,再在这里使用none隐藏,可以成功隐藏图片*/
    }
    
    

    绑定同一个,图片display:none,就把悬浮的css绑定在图片上,这样就可以做到显示隐藏了

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(1条)

报告相同问题?

悬赏问题

  • ¥15 求chat4.0解答一道线性规划题,用lingo编程运行,第一问要求写出数学模型和lingo语言编程模型,第二问第三问解答就行,我的ddl要到了谁来求了
  • ¥15 Ubuntu在安装序列比对软件STAR时出现报错如何解决
  • ¥50 树莓派安卓APK系统签名
  • ¥15 maple软件,用solve求反函数出现rootof,怎么办?
  • ¥65 汇编语言除法溢出问题
  • ¥15 Visual Studio问题
  • ¥20 求一个html代码,有偿
  • ¥100 关于使用MATLAB中copularnd函数的问题
  • ¥20 在虚拟机的pycharm上
  • ¥15 jupyterthemes 设置完毕后没有效果