在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問(wèn)答/HTML/ css hover 產(chǎn)生的一個(gè)Bug,怎么解決?

css hover 產(chǎn)生的一個(gè)Bug,怎么解決?

代碼很簡(jiǎn)單,鼠標(biāo)hover parent時(shí),顯示parent里面隱藏的child。問(wèn)題在于,當(dāng)隨意多次點(diǎn)擊child的時(shí)候,鼠標(biāo)便會(huì)失去hover,child便消失了。請(qǐng)問(wèn)如何解決?

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
        .parent{
            width: 500px;
            height: 300px;
            background: #ccc;
            position: relative;
        }
        .parent:hover .child{
            display: block;
        }
        .child{
            width: 50px;
            height: 30px;
            background: red;
            position: absolute;
            top: 50px;
            left: 30px;
            cursor: pointer;
            display: none;
        }
    </style>
</head>
<body>
    <div class="parent">
        <div class="child"></div>
    </div>
</body>
</html>

鼠標(biāo)一直在紅色區(qū)域點(diǎn)擊,鼠標(biāo)失去hover(Google Chrome)圖片描述

回答
編輯回答
鹿惑

<div class="child"></div>這里標(biāo)簽沒(méi)關(guān)閉,但是你說(shuō)的這個(gè)問(wèn)題我在多個(gè)瀏覽器也沒(méi)復(fù)現(xiàn)。

2018年3月4日 05:09
編輯回答
雨蝶

clipboard.png
題主,我在firefox,chrome和ie11下都測(cè)試了下,沒(méi)出現(xiàn)點(diǎn)擊紅色區(qū)域后此區(qū)域消失的情況。你是怎么復(fù)現(xiàn)的?

2018年2月27日 03:17
編輯回答
有點(diǎn)壞

具體原因不知,不過(guò)可以添加個(gè)樣式解決

.parent:hover .child,
.child:hover{
    display: block;
}
2018年1月4日 12:21
編輯回答
浪婳

未發(fā)現(xiàn)問(wèn)題哦,樓主用的是什么瀏覽器呢

2018年6月26日 10:30