0

:active 和 :hover 在元素上都处于活动状态时的行为是什么。我写了一些代码http://jsfiddle.net/z6v4r/来演示这个。显然 :hover 是赢家。

在另一种情况下（我正在研究），我为以下HTML编写了 css ：

<div class="abc">
    <div class="xyz">
        <input type="Something">
        </input>
    </div> 
</div>

CSS

div.abc div.xyz input:hover
{
border: 1px inset rgb(0, 69, 124);
    border-radius:15px;
    background-color: rgb(0, 69, 124);
    color:white;
}
div.abc div.xyz input:active,div.abc div.xyz input:focus
{
    border: 1px inset rgb(0, 69, 124);
    border-radius:15px;
    background-color:rgba(66, 87, 133, 0.24);
    outline-style:none;
}

现在事情在所有这些活动上，我得到了 :active/:focus 的背景颜色和来自 :hover 的字体颜色。

我需要如何将这些应用于元素的概念。

4

2 回答 2

1

这是因为您首先为 :hover 指定 CSS，然后为 :active 指定 CSS。CSS 优先于最后出现的值。因此，在您的情况下，如果您想优先考虑 :hover 情况，请稍后在文件中写入。

于 2013-10-04T13:03:19.217 回答
1

活动是针对click事件的。

如果您握住鼠标，您可以看到您的属性在工作。

您可以使用 chrome 在 chrome 中调试它toggle element state 在此处输入图像描述

这对于繁重的过程非常有用，例如需要时间从服务器获取答案或移动到不同页面时register。login

于 2013-10-04T12:53:29.253 回答