html - 从其他 div 应用的样式

Question

我在 2 个不同的页面上有不同名称的 div。我在 div id="contact" 中悬停和聚焦时向 textarea 应用了背景色。

<style>
     #contact input:hover,textarea:hover    {   background-color:#CFF;  }
     #contact input:focus,textarea:focus    {   background-color:#CCF;  }
 </style>

<div id="contact">
    <li>
        <label for="message">Message</label>
        <textarea class="required" name="message"></textarea>
     </li>
</div>

不同页面上不同名称的 div 中的文本区域在悬停和聚焦时显示背景，但我不希望它显示。

<div id="wants">
    <li>
        <label>Additional information - the more you tell us, the better we can help.</label>
        <textarea name="addlinfo" cols="" rows=""></textarea>
    </li>
</div>

Dreamweaver 的代码导航器显示为“联系人”创建的样式应用于“需求”。我不知道为什么。 textarea 是唯一受“想要”影响的元素。页面上有输入，不受影响。有人可以向这个菜鸟解释一下吗？

Answer 1

你需要

#contact input:hover, #contact textarea:hover {}
#contact input:focus, #contact textarea:focus {}

而不是您当前的选择器。

Jsfiddle example

您当前的样式选择任何 textarea，而不考虑其父级。