我想将 z-index 应用于每个嵌套的 div。很难为 style.css 中的每个 div 编写 css。所以我正在使用 jquery 来获取这个目标,但没有运气。这是代码:
HTML代码
<div class="row grid-items">
<div class="item col-lg-4">
Box 1
<p></p>
</div>
<div class="item col-lg-4">
Box 2
<p></p>
</div>
<div class="item col-lg-4">
Box 3
<p></p>
</div>
<div class="item col-lg-4">
Box 4
<p></p>
</div>
<div class="item col-lg-4">
Box 5
<p></p>
</div>
<div class="item col-lg-4">
Box 6
<p></p>
</div>
<div class="item col-lg-4">
Box 7
<p></p>
</div>
<div class="item col-lg-4">
Box 8
<p></p>
</div>
</div>
J查询代码
$no_of_items = $('.grid-items .item').length;
for ($j = $no_of_items; $j > 0; $j--) {
console.log($j);
$('.grid-items .item').css('z-index', $j);
};
输出:
我需要 z-index (8,7,6,5,4,3,2,1)
提前致谢
最佳答案
使用:
var len=$('.grid-items .item').length;
$('.grid-items .item').each(function(i){
$(this).css('z-index',len-i)
});
解决方案 2: Squint 的更好方法。
var len=$('.grid-items .item').length;
$('.grid-items .item').css('z-index', function(i){ return len-i; })
关于javascript - 使用查询将不同的 CSS 应用于所有嵌套的 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25995220/