gpt4 book ai didi

css - :hover works in firebug but not in firefox

转载 作者:太空宇宙 更新时间:2023-11-04 08:50:21 25 4
gpt4 key购买 nike

我创建了一个 div,悬停时我希望背景颜色变为红色。当我在 Firefox 中查看它并将鼠标悬停在 div 上时,没有任何反应。我可以在 Firebug 中检查它并强制悬停类 - 这有效!但为什么它不能在浏览器中正常工作?

<!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>
<link rel="stylesheet" href="main.css">
</head>
<body>
<button>
<div class="outer-circle">
<p>HELLO WORLD!</p>
</div>
</button>
</body>
</html>

CSS 如下:

.outer-circle {
height: 250px;
width: 250px;
border-radius: 50%;
background-color: blue;
}

.outer-circle:hover {
background-color: red;
}

button {
background-color: transparent;
border: none;
}

最佳答案

像下面这样提供悬停样式,而不是 .outer-cirlce:hover

button:hover .outer-circle {
background-color: red;
}

它会起作用的。试试吧

关于css - :hover works in firebug but not in firefox,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43487030/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com