html - 所有按钮的通用 css，但根据 id 更改每个按钮的颜色

Question

我不是 html 开发人员，所以我想问一下如何根据按钮的 id 为按钮着色。我对所有这些都进行了一般设置，但我想根据 id 更改每个设置的颜色。谢谢。

button {
  height:6vh;
  width:10vw;
  font-size:3vh;
  text-align:center;
  position:relative;
  border:none;
}

button#0 {
  background-color:red;
}

button#1 {
  background-color:green;
}

button#2 {
  background-color:yellow;
}

<button  name="0" id="0" type="submit">0</button><button  name="1" id="1" type="submit">1</button><button  name="2" id="2" type="submit">2</button>

Answer 1

ID不能以数字开头，可以用class

button {
  height: 6vh;
  width: 10vw;
  font-size: 3vh;
  text-align: center;
  position: relative;
  border: none;
}

.button0 {
  background-color: red;
}

.button1 {
  background-color: green;
}

.button2 {
  background-color: yellow;
}

<button  name="0" id="0" class="button0" type="submit">0</button>
<button  name="1" id="0" class="button1" type="submit">1</button>
<button  name="0" id="2" class="button2" type="submit">2</button>