Assign color to a button depending on its value - HTML CSS [closed]

Navigation
-3

Having these two buttons: 

<button type="button" id="boton_uno" class="boton-estado btn-default">Boton 1</button>&nbsp;&nbsp;&nbsp;
<button type="button" id="boton_dos" class="boton-estado btn-default">Boton 2</button>

depending on whether the value is 0, 1 or 2, as the color varies: 0 - red 1 - green 2 - orange

In HTML if the color would be red: <button type="button" style="background:red"> , but how would it be depending on the value you have ...?

Example: the initial state is 0, I ask in a modal if we want to change the state to state = 1 (color of the green button) or state = 2 (color of the orange button)

    
asked by omaza1990 18.11.2016 в 14:15
source

2 answers

2

You can add or remove styles with js in the modal response: 

var boton = document.querySelector("#boton_uno");
if(estado==1){
  boton.style.backgroundColor = "green";
} else {
  ...
    
answered by 18.11.2016 / 14:26
source
3

I guess you mean you're going to do something like <button value="1"> no?

If so, the solution is this CSS: 

button[value='0'] {
  color: red;
}

button[value='1'] {
  color: green;
}

button[value='2'] {
  color: orange;
}

Here you have a fiddle:

link

    
answered by 18.11.2016 в 14:25
Put the symbol ● in java [closed] Add naturals to "n" [closed]