Html 基于选择值的CSS背景色

希望这里有一个简单的问题。我有以下html代码：

<select id="dropdown">
  <option value="#00FFFF">Cyan</option>
  <option value="#FF00FF">Magenta</option>
</select>
<textarea style="background-color:[dropdown's selected value]">Sample Text</textarea>

青色
洋红
示例文本

我希望textarea的背景颜色根据下拉列表的选择动态变化。有没有一种简单的方法可以使用CSS引用下拉列表的值，或者JavaScript是更好的方法？HTML5和CSS3在这里绝对是公平的游戏。谢谢

这里：

在这里：

---

仅使用HTML和CSS无法做到这一点。需要一些JavaScript。例如：

<select id="dropdown" onchange="setBg(this)">
  <option selected value="#FFFFFF">White</option>
  <option value="#00FFFF">Cyan</option>
  <option value="#FF00FF">Magenta</option>
</select>
<textarea id="ta">Sample Text</textarea>
<script>
function setBg(sel) { 
  document.getElementById('ta').style.background = 
     sel.options[sel.selectedIndex].value;
}
</script>

白色
青色
洋红
示例文本
函数setBg（sel）{
document.getElementById（'ta'）。style.background=
sel.options[sel.selectedIndex].值；
}

仅使用HTML和CSS无法做到这一点。需要一些JavaScript。例如：

<select id="dropdown" onchange="setBg(this)">
  <option selected value="#FFFFFF">White</option>
  <option value="#00FFFF">Cyan</option>
  <option value="#FF00FF">Magenta</option>
</select>
<textarea id="ta">Sample Text</textarea>
<script>
function setBg(sel) { 
  document.getElementById('ta').style.background = 
     sel.options[sel.selectedIndex].value;
}
</script>

白色
青色
洋红
示例文本
函数setBg（sel）{
document.getElementById（'ta'）。style.background=
sel.options[sel.selectedIndex].值；
}

<select id="dropdown" onchange="setBg(this)">
  <option selected value="#FFFFFF">White</option>
  <option value="#00FFFF">Cyan</option>
  <option value="#FF00FF">Magenta</option>
</select>
<textarea id="ta">Sample Text</textarea>
<script>
function setBg(sel) { 
  document.getElementById('ta').style.background = 
     sel.options[sel.selectedIndex].value;
}
</script>