根据值更改按钮css

Question

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

例如:

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

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

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

Answer 1

是的,使用属性选择器.

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

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

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

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

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