Question

我在按钮内有一个span标签。我只是希望当我悬停按钮时，跨度文本会在从白色悬停到黑暗时发生变化。现在它唯一可行的方法是将悬停放在span标签上，然后鼠标指针必须完全位于按钮内的文本上。如果没有，整个按钮在悬停时是白色的。

a.sf-button.transparent-dark span {

}

a.sf-button.transparent-dark span:hover {

}

a.sf-button.transparent-dark {
    color: #FFF;!important;
    background-color: #12225b;
}

a.sf-button.transparent-dark:hover {
    color: #666;!important;
    background-color: #FFF;
    border: 1px solid #222;
    border: 1px solid rgba(34,34,34,.2);
}

a.sf-button, a.sf-button:hover, #footer a.sf-button:hover {
    color: #666;
    background-color: #FFF;
    border: 1px solid #222;
    border: 1px solid rgba(34,34,34,.2);
}
`

我无法更改按钮的设置方式，因为它是主题的一部分。

这是HTML：

<a class="sf-button large transparent-dark stroke-to-fill " href="https://www.domain.com" target="_self"><span class="text">button text</span></a>

我实际上已经为此设置了一个小提琴。它实际上适用于小提琴。所以也许这意味着有些东西在干扰它。但我无法确定会是什么。

http://jsfiddle.net/robmcmon/4ZWUX/

Answer 1

你应该可以这样做：

.test-button:hover .test-span {
   color: #ff0000;
}

这应该会在更改按钮时更改跨度外观。

小提琴：http://jsfiddle.net/DbpgW/

在按钮悬停时更改范围标记

1 个答案: