Question

我正在使用以下代码查看我的所有按钮：

input[type=submit] {
font-family: Modern, serif;
border: none;
margin-right: 1em;
padding-left: 30px;
padding-right: 30px;
text-decoration: none;
font-size: 20px;
background: #549396;
color: white;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
position: relative;
}

问题是我的所有按钮都是一样的，我希望能够调用某些按钮并改变它们的外观。例如，蓝色关注按钮和灰色取消关注按钮。谢谢你们

Answer 1

你想做什么似乎是一个“黑客”。您有许多具有相同HTML的按钮，您只想更改其中一些？

请记住您正在使用表单...然后您有一个表单名称。

您可以使用此 CSS ：

form[name=login] input[type=submit]
{
    background: green;
}

form[name=subscribe] input[type=submit]
{
    background: red;
}

我假设你的表格有一个名字。

Answer 2

<强> HTML

<input type="submit" value="Submit" />
<input type="submit" value="Submit" class="blueBtn" />
<input type="submit" value="Submit" class="grayBtn" />

您可以设置每个课程的样式并将其添加到按钮中，但您不应该有多个输入类型=＆＃34;提交＆＃34;以单一形式。您可能希望将它们更改为输入类型=＆＃34;按钮＆＃34;。

这是你想要的吗？ DEMO

Answer 3

你可以添加课程吗？只是针对另一个班级：

input[type=submit] {
  font-family: Modern, serif;
  border: none;
  margin-right: 1em;
  padding-left: 30px;
  padding-right: 30px;
  text-decoration: none;
  font-size: 20px;
  background: #549396;
  color: white;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  border-radius: 2px;
  position: relative;
}

input[type=submit].red{
   background: red;
}

input[type=submit].green{
   background: green;
}

HTML：

<input type="submit" class="red"/>
<input type="submit" class="green"/>

CSS - 更改按钮颜色？

3 个答案: