0

关于格式化输入按钮，我有一个非常特殊的问题。

在我的第一页上，我创建了一个名为“按钮”的 CSS 规则，用于格式化单独排成一行的按钮。它工作得很好，按钮如下图所示

在此处输入图像描述

这个按钮的css在下面

.button {
    width: 100%;
    height: 15mm;
    background-color: #AAA;
    color: #FFFFFF;
    font-size: 20px;
    text-shadow: 0px -2px #888;
    border:none; !important
    -moz-box-shadow:    0px 2px 0px 0px #888, 0px -2px 0px 0px #DDD;
    -webkit-box-shadow: 0px 2px 0px 0px #888, 0px -2px 0px 0px #DDD;
    box-shadow:         0px 2px 0px 0px #888, 0px -2px 0px 0px #DDD;

}

在 html 中，它看起来像这样：

<a href="dashboard.html">
  <input class="button" type="button" value="SUBMIT" action="dashboard.html" />
</a>

问题是，我已经复制了这条规则，并在第二页中对平行的按钮稍作了修改，并且它没有格式化按钮。奇怪的是，它出现在dreamweaver中

在此处输入图像描述

但在任何浏览器中，它都会丢失它的格式

在此处输入图像描述

这是并行按钮的CSS

.2buttons {
    width: 40%;
    height: 15mm;
    background-color: #AAA;
    color: #FFFFFF;
    font-size: 20px;
    text-shadow: 0px -2px #888;
    border:none; !important
    -moz-box-shadow:    0px 2px 0px 0px #888, 0px -2px 0px 0px #DDD;
    -webkit-box-shadow: 0px 2px 0px 0px #888, 0px -2px 0px 0px #DDD;
    box-shadow:         0px 2px 0px 0px #888, 0px -2px 0px 0px #DDD;

}

这是html

<a href="report.html">
  <input class="2buttons" type="button" value="OK"/>
</a>

奇怪的是，即使您将第一个有效的 css 规则应用于这些按钮，它们仍然保持未格式化。

4

4 回答 4

2

您的代码中有两件事。

首先永远不要以数字 开头的班级和ID名称。

像这样写.buttons2而不是.2buttons。

＆ 第二

像这样写

border:none !important;

而不是这个：

border:none; !important
于 2012-09-26T07:45:20.743 回答
1

border:none; !important应该border:none !important;

并将类名更改为 .twoButtons （或其他）而不是 .2buttons 因为类名不能以数字开头......

于 2012-09-26T07:43:33.690 回答
1

不要以数字开头的类名！这仅在 Internet Explorer 中受支持。看

http://www.w3schools.com/css/css_id_class.asp

于 2012-09-26T07:46:41.887 回答
1

您的问题在于班级名称以数字开头。你应该改变它。

于 2012-09-26T07:46:54.067 回答