Question

我正在尝试使用CSS将所有按钮设置为这种样式：

button {
  background-color: #4CAF50;
  border: none;
  color: black;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
 }

但是，现在，我有不同类型的按钮，其中它为<input type=“button>。我试图改变CSS，使其包括这样的按钮和输入：

button, input {
  background-color: #4CAF50;
  border: none;
  color: black;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
}

问题在于，它使所有输入（如文本字段）变为绿色。那么，有什么方法可以让我进行输入，仅对具有按钮类型的输入进行样式设置？

Answer 1

更改

button, input

到

button, input[type="button"]

这使用CSS'attribute selector syntax。或为您的button类型输入提供一个通用的CSS类。例如<input type="button" class="myButton">，然后将选择器更改为：

button, .myButton {...

Answer 2

只需将类添加到要以这种方式设置样式的任何元素，然后将其定位为类而不是按钮即可。 CSS Classes

如何自定义<input type =“ button” />？

2 个答案: