For AI agents: the complete documentation index is available at /next/llms.txt, the full documentation bundle is available at /next/llms-full.txt, and this page is available as Markdown at /next/api/css/properties/z-index.md.
Lynx
  • English
  • z-index

    Introduction

    The z-index CSS property sets the z-order of an element and its descendants or flex items. Overlapping elements with a larger z-index cover those with a smaller one.

    Info

    If we want to generate stacking context, you can add z-index: 0 to an element. For example, make children follow the scroll by adding z-index: 0 to the scroll-view

    It is not recommended to use z-index in the direct children of list. This may affect the reuse of list. If you use z-index in the list item, the item should be a stacking context.

    Examples

    Syntax

    z-index: 0;
    z-index: 3;
    z-index: 289;
    z-index: -1;

    Values

    • <number> This integer is the stack level of the generated box in the current stacking context.

    • Default value auto

    Formal definition

    Initial valueempty value
    Applies toall elements
    Inheritedno
    Animatableno

    Formal syntax

    z-index = <integer>

    Difference between web

    The default value of web is auto. Lynx determines whether it is a stacking context by setting z-index property.

    Compatibility

    LCD tables only load in the browser

    Except as otherwise noted, this work is licensed under a Creative Commons Attribution 4.0 International License, and code samples are licensed under the Apache License 2.0.