css 鼠标放置到一个div上，使得另外一个隐藏的div显示

最新推荐文章于 2023-09-08 16:57:04 发布

黄坤

最新推荐文章于 2023-09-08 16:57:04 发布

阅读量7.6k

点赞数 5

分类专栏：前端

本文链接：https://blog.csdn.net/m0_45025658/article/details/105496076

版权

前端专栏收录该内容

10 篇文章 0 订阅

订阅专栏

首先先看两个div之间的关系，选择下面的哪种方式。

控制div：hover 关系被控制div{
css的操作；
}
. 在这里插入图片描述
举个例子，下面两个div，是父子关系，放置到一个div上，使得另外一个隐藏的div显示

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <style>
        div#a
        {
            width:100px;
            height:100px;
            background:red;
        }
        div#b
        {
            width:100px;
            height:100px;
            background:yellow;
            display: none;
        }

        #a:hover #b
        {
            width:300px;
            height: 500px;
            display: block;
        }
    </style>
</head>
<body>


<div id="a">
<div id="b"></div>
</div>

</body>
</html>

效果如下所示： 在这里插入图片描述

黄坤

关注

5
点赞
踩
17

收藏

觉得还不错? 一键收藏
0
评论
css 鼠标放置到一个div上，使得另外一个隐藏的div显示

首先先看两个div之间的关系，选择下面的哪种方式。控制div：hover 关系被控制div{css的操作；}.举个例子，下面两个div，是父子关系，放置到一个div上，使得另外一个隐藏的div显示<!DOCTYPE html><html><head> <meta charset="utf-8"> <style&...
复制链接

扫一扫

专栏目录