-3

head没有背景和黑色，鼠标悬停时它的颜色将是白色和背景黑色，它工作正常但

onmouse over oncontent我想改变颜色head？如何？只能使用css吗？

 <ul id="meg">
   <li><a href="#">head</a>
    <div>
    <h2>su head</h2>
    <p><a href="#">content</a></p>
    <p><a href="#">content</a></p>
     </div>
    </li>
 <li><a href="#">head</a>
    <div>
    <h2>su head</h2>
    <p><a href="#">content</a></p>
    <p><a href="#">content</a></p>
     </div>
    </li>
</ul>
4

4 回答 4

1

这可能有效。我知道css能够在结束标签之后影响元素而不是之前，所以这与过去的“+”相反。

<style type="text/css">
   #content:hover - #head { background-color: black; color: white; }
  </style>

 <ul id="meg">
   <div id="head">
   <li><a href="#">head</a>
   </div>
   <div id="content">
    <h2>su head</h2>
    <p><a href="#">content</a></p>
    <p><a href="#">content</a></p>
     </div>
    </li>
    </ul>
于 2012-07-28T07:24:35.037 回答
1

你可以用 JavaScript 做到这一点。虽然我不完全清楚你想要什么，但我试了一下： 

<!DOCTYPE html> 
<html>
<head>
<script type="text/javascript">  
function stuff(){
   var k = document.getElementsByTagName('li');
   for (var i = 0; i < k.length; i++) {
        var s = k[i];     
        s.firstChild.style.color = 'white';
        s.firstChild.style.backgroundColor= 'black';
    }
}
</script>
</head>
<body>
  <ul id="meg">
    <li>
       <a href="#">head</a>
       <div>
          <h2>su head</h2>
          <p><a href="#" onmouseover="stuff()">content</a></p>
       </div>
    </li>
  </ul>
</body>
</html>
于 2012-07-28T07:52:37.420 回答
0

考虑使用 JQuery。

本视频教程将为您提供帮助。

于 2012-07-28T06:58:42.163 回答
0

你试过#meg li a:hover { background-color:#000;color:#FFF; }

于 2012-07-28T07:01:48.043 回答