3

我不明白为什么会这样：

.button:active {
    position:relative;
    top: 2px;
    left:2px;
}

但这不起作用：

.button:hover { 
    font-size:17px;
}

它在我使用 id 时有效，但我希望它为所有按钮激活：

#btnhome:hover{
    font-size:17px;
}

这工作正常，但上课它不会？我究竟做错了什么？

4

4 回答 4

2

使用id它并且它确实有效，因此肯定与特异性有关，过度骑行，试试这个

演示

演示 + !important

.button:hover { 
    font-size:17px !important; /* Actually you don't even need !important */
}
于 2012-12-25T20:42:07.090 回答
0

尝试：
.button *:hover { font-size:17px; }

于 2012-12-25T20:38:55.633 回答
0

这是特异性。ID 优先于伪样式。您需要重写 CSS 以使其更通用，并且只将唯一值放在 ID 上或使用 ID 加上伪选择器。

我从 ID 中取出了常见的东西并将它们移到了一个基本的 .button 类中：

.button{
    width: 84px;
    height: 46px;
    background-color:#000;
    border: none;
    color: white;    
    font-size:14px;
    font-weight:700;
}
.button:hover { 
     font-size:17px;
}

查看这个小提琴以查看它的实际效果：http: //jsfiddle.net/kJfmR/

于 2012-12-31T17:43:31.567 回答
0

肯定有一个外部 .css 文件由您通过使用链接标签包含，其中.button:hover {font-size:somethingelse !important;}定义。这就是为什么除非再次使用 !important 才能更改它。

于 2012-12-25T20:55:58.290 回答