当前位置: 首页 > 面试题库 >

CSS中的Z-index无效

薛元忠
2023-03-14
问题内容

这个div

<div style="position: relative; z-index: 99;">123</div>

比这上面显示的

<div style="position: fixed; z-index: 3000;">456</div>

当我在第一个div中分配z-index:98时,一切都很好!如果需要,我可以提供更多代码。


问题答案:

z-index面向其父级-它们都在同一个父级元素中吗?z-index实现了自己的堆栈-例如:

框D,E和F是框C的后代->框F(z-index:-1)覆盖框B(z-index:1),因为它是框c的后裔(此框与z-索引:3,超出框b)

<div style="position:absolute; top:100px; left:100px; z-index:2; border:1px solid #888; background:#f88;">
      <b>A:2</b>
    </div>

    <div style="position:absolute; top:130px; left:130px; z-index:1; border:1px solid #888; background:#88f;">
      <b>B:1</b>
    </div>

    <div style="position:absolute; top:190px; left:270px; width:280px; height:280px; z-index:3;
                border:1px solid #888; background:#eee;">
      <b>C:3</b>

      <div style="position:absolute; top:30px; left:-30px; z-index:2; border:1px solid #888; background:#8f8;">
        <b>D:2</b>
      </div>

      <div style="position:absolute; top:-30px; left:40px; z-index:3; border:1px solid #888; background:#ff8;">
        <b>E:3</b>
      </div>

      <div style="position:absolute; top:60px; left:-60px; z-index:-1; border:1px solid #888; background:#8ff;">
        <b>F:-1</b>
      </div>
    </div>


 类似资料:
  • 描述 (Description) z-index设置元素的堆叠级别。 可能的值 (Possible Values) auto - 元素的堆栈级别与其父元素的堆栈级别相同。 integer - 元素的堆栈级别设置为给定值,并为任何后代元素建立新的堆栈上下文。 适用于 (Applies to) 所有定位的元素。 DOM语法 (DOM Syntax) object.style.zindex = "1";

  • 默认情况下,网页是一个二维空间,并根据在DOM中的顺序,从左到右,从上到下,依次排列各个元素。 当页面上出现相对定位、或绝对定位、或固定定位的元素后,如果对一个元素设置了偏移,就很可能出现元素相互重叠的情况。如果把页面作为 x-y 轴,垂直于页面的方向就是 z 轴,重叠的情况就发生在 z 轴。 元素在 z轴 的位置,取决于它在DOM中的先后顺序。如果两个元素发生重叠,在DOM中先出现的元素,通常排

  • 问题内容: 我有两个绝对重叠的div元素。两者都通过CSS设置了z- index值。我使用webkit转换在屏幕外为这些元素设置动画,然后再回到屏幕上。转换后,元素不再遵守其设置值。 一旦我对它们进行webkit转换,谁能解释div元素的z-index / stack-order会发生什么?并说明如何保持div元素的堆叠顺序? 这是有关我如何进行转换的更多信息。 在转换之前,每个元素都会通过CSS

  • 问题内容: 此属性使我感到困惑。 好..我在谷歌搜索: 什么是Z索引? _z-index属性指定元素的堆栈顺序。具有较高堆叠顺序的元素始终位于具有较低堆叠顺序的元素之前。注意:z-index仅适用于定位的元素(position:absolute,position:relative或position:fixed)。 z-index的用途是什么? _元素彼此重叠的顺序。 为此,可以为每个元素分配一个数

  • z-index总是达不到效果,对层这块总是无法用z-index搞定,求指教

  • 本文向大家介绍z-index如何定位?相关面试题,主要包含被问及z-index如何定位?时的应答技巧和注意事项,需要的朋友参考一下 参考回答: z-index属性设置元素的堆叠顺序,拥有更好堆叠顺序的元素会处于较低顺序元素之前,z-index可以为负,且z-index只能在定位元素上奏效,该属性设置一个定位元素沿z轴的位置,如果为正数,离用户越近,为负数,离用户越远,它的属性值有auto,默认,堆