0
<html>
<head>
<script src="jquery.min.js"></script>
</head>
<body>
 <div id="disp"> 
   <div>
      hi how are u
   </div>
   <div style="position:absolute;left:50px;top:100px;">
      hello
   </div>
 </div>
 <script type="text/javascript">
  $(function(){
    $("#disp").css({"background-color":"#00ff00"});
  });
  </script>
</body>
</html>

如果您运行此代码,它将打印两个 div 一个是“嗨,你好吗”和“你好”,这里一个 div 有一个绿色一个是白色我已经改变了父 div 的颜色属性。我的问题是为什么下一个 div 没有变成绿色我知道问题是绝对位置我如何处理这种情况

4

5 回答 5

1

只需继承父级的background-color属性:

<div style="position:absolute;left:50px;top:100px; background-color: inherit">
于 2013-02-08T06:56:18.000 回答
0

在这里,你可以试试这个

$('#disp > div').eq(1).css('background-color', 'red');

希望这可以帮助..

于 2013-02-08T06:44:08.717 回答
0

您可以使用nth-childcss 选择器(即选择#disp容器中的第二个子 div):

$("#disp div:nth-child(2)").css({"background-color":"#00ff00"});

然后,您可以根据需要修改您的 css 样式。

于 2013-02-08T06:45:29.757 回答
0

你应该写 css 而不是 jquery

   #disp > div {
     background:#00ff00;
   }
于 2013-02-08T06:52:25.263 回答
0

我没有尝试过,但我想知道以下内容是否可行:

$("#disp div).filter(function() {
    return $(this).css("position") == "absolute";
}).css({"background-color":"#00ff00"});
于 2013-02-08T06:47:42.833 回答