Question

虽然.CSS适用于我添加的所有元素，但它不适用于“立即订阅”按钮。

这是CSS

subbutton
{
    background-image:url(images/button_gradient.png); border:2px solid #FFFFFF !important;
    background-color:#be0000;
    font-size: 12px;
    font-family: Lucida Sans Unicode;
    color: #F8F8F8;
    border-color: #be0000;
    text-transform: uppercase;
    margin: 5px 10px 5px 0;
    letter-spacing: 1px;
    padding: 10px 30px;
    line-height: 15px;
    box-shadow: 0 1px 2px rgba (0, 0, 0, 0.1);
}

这是HTML

<div class="af-element buttonContainer">
   <input name="Subscribe" class="subbutton" type="submit" value="Subscribe Now!" tabindex="503" />
   <div class="af-clear">
   </div>
</div>

看起来我的代码被默认的样式代理样式表覆盖了，我不明白为什么。

以下是该网站的链接：http://xn--mxadnimgroqkg.gr/fitnessforum/

Answer 1

你必须使用“。”而不是“＃”，因为你必须选择类不是这样的类：

.subbutton

    {
        background-image:url(images/button_gradient.png); border:2px solid #FFFFFF !important;
        background-color:#be0000;
        font-size: 12px;
        font-family: Lucida Sans Unicode;
        color: #F8F8F8;
        border-color: #be0000;
        text-transform: uppercase;
        margin: 5px 10px 5px 0;
        letter-spacing: 1px;
        padding: 10px 30px;
        line-height: 15px;
        box-shadow: 0 1px 2px rgba (0, 0, 0, 0.1);
    }

Answer 2

CSS规则使用 id 选择器#subbutton，您的标记使用类选择器.subbutton。使选择器规则及其使用保持一致（即在两个地方都使用#或.）将解决问题。

Answer 3

它可以像CSS中的拼写错误一样简单吗？

.subbutton
{
  /* your css */
}

注意。选择之前（点）

Answer 4

您在css文件中使用了 id 选择器：#subbutton，但您在HTML代码中指定了 class 属性：class =“subbutton”

Answer 5

CSS应该是......

.subbutton
{
...
}

匹配输入...

<input name="Subscribe" class="subbutton" type="submit" value="Subscribe Now!" tabindex="503" />

您目前正在使用ID ...

#subbutton
{
...
}

我的CSS被样式代理覆盖

5 个答案: