Question

是否可以根据值更改按钮css。我想要保存不同的css和不同的css取消类型按钮。

例如：

<input type="button" value="Save">
<input type="button" value="Cancel">

save { /* Some CSS */ }
cancel{ /* Some CSS */ }

注意：我不能使用类，因为所有输入都有相同的类，因为有很多按钮。我也不想使用Jquery。

Answer 1

是的，带有属性选择器。

＆＃13;

input[value="Save"] {
  color: red;
}
input[value*="Cancel"] {
  color: blue;
}

＆＃13;

<input type="submit" value="Save">
<input type="submit" value="Cancel">
<input type="text" value="Cancel-me-too">

＆＃13;

要定位特定按钮类型，您需要多个属性选择器

＆＃13;

input[type="submit"][value="Save"] {
  color: red;
}
input[type="submit"][value*="Cancel"] {
  color: blue;
}

＆＃13;

<input type="submit" value="Save">
<input type="submit" value="Cancel">
<input type="text" value="Save">

＆＃13;

Answer 2

使用CSS属性选择器：

input[value="Save"] {background:green;}
input[value="Cancel"] {background:grey;}

Answer 3

我觉得jquery似乎没有必要按钮很大，必须使用该类试试这个代码。

<style type="text/css">
input[value="Save"] {
  color: green;
}
input[value*="Cancel"] {
  color: black;
}
</style>
<input type="submit" value="Save">
<input type="submit" value="Cancel">

根据值更改按钮css

3 个答案: