htnl5+css3布局中,下拉菜单遮挡的内容透视(如图),该如何解决?

图片说明图片说明

3个回答

 <!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <script src="js/jquery.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript">
        $(function(){
            $('button').click(function(){
                $(".menu1 ,.menu2").slideToggle();
            })
        })
    </script>
    <style type="text/css">
        .menu{
            background-color: gray;
            width: 400px;
            height: 400px;
        }
        .menu1{
            background-color: chartreuse;
            width: 100px;
            display: none;
        }
        .menu2{
            background-color: red;
            width: 100px;
            display: none;
            position: absolute;
            top: 35px;
            left: 120px;
        }
        li{
            list-style-type: none;
        }
    </style>
    <body>
        <div class="menu">
            <button>展开</button>
            <div class="menu1">
                <li>1</li>
                <li>2</li>
                <li>3</li>
            </div>
        </div>
        <div class="menu2">
                <li>1</li>
                <li>2</li>
                <li>3</li>
        </div>
    </body>
</html>

下拉的菜单控制一下透明度就好了

qq_29594393
当作看不见 回复xyjwyq: 写个给你看一下吧,表示醉了
大约 4 年之前 回复
xyjwyq
xyjwyq 回复当作看不见: 我将下拉列表的z-index设为99,还是不行,是不是因为那个”+展开折叠“是按钮的缘故呢?
大约 4 年之前 回复
qq_29594393
当作看不见 回复xyjwyq: z-index,我还以为你是要让下拉的菜单下面被遮挡的部分显示出来呢?,用z-index,不用设置透明度,只要下拉的那个块的z-index比菜单的值更大就好,默认为1
大约 4 年之前 回复
xyjwyq
xyjwyq 回复当作看不见:设置了下拉菜单的透明度为0.3,下面的内容不是出现的更明显吗,我要的效果是下拉菜单可以挡住内容啊
大约 4 年之前 回复
qq_29594393
当作看不见 回复xyjwyq: 你设置为0.3左右的样子就可以看到效果了,默认是1,范围为0-1,
大约 4 年之前 回复
xyjwyq
xyjwyq 尝试设置opacity,但是没有效果,查了下标签元素与的透明度默认为1,改怎么办呢
大约 4 年之前 回复

用h5的rgba颜色,最后一个是透明度

 background: rgba(0, 0, 0, 0.6)
xyjwyq
xyjwyq 回复showbo: 本来透明度采用默认值1,都遮挡不住下面的内容,如果透明度往下调,不是更挡不住吗
大约 4 年之前 回复
showbo
支付宝加好友偷能量挖,胡杨等着我的招呼 回复xyjwyq: 越小越透明,不要透明变为1或者直接background:#000
大约 4 年之前 回复
xyjwyq
xyjwyq 将透明度降低,下拉菜单遮挡的内容会更清晰啊,不是吗?
大约 4 年之前 回复
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问
相关内容推荐