I want to be able to update the background color/image when the user clicks a radio button or selects an option from a drop down. I am able to change the drop down background but not the body background. Is this possible with just HTML + CSS?
Here is my last attempt:
HTML
<body>
<div>
<select id="role">
<option value="none">None</option>
<option value="fighter">Fighter</option>
<option value="cleric">Cleric</option>
<option value="mage">Mage</option>
<option value="rogue">Rogue</option>
</select>
</div>
</body>
CSS
#role option[value="fighter"] {background-color: indianred;}
#role option[value="mage"] {background-color: aquamarine;}
#role option[value="cleric"] {background-color: bisque;}
#role option[value="rogue"] {background-color: yellowgreen;}