CSS中的z-index屬性控制了元素在層疊順序中的位置,可以讓一個元素在另一個元素的前面或后面顯示。而當我們添加z-index:9999;時,常常會出現誤解,覺得元素一定會在最前面顯示,但實際情況并非如此。
當我們給一個元素添加z-index屬性時,此元素的父元素和兄弟元素的z-index屬性都會影響它的顯示順序,而且z-index值越大的元素越靠上顯示。也就是說,無論你設置多少z-index值,如果有更高層級、更高z-index值的兄弟元素存在,那么你設置的z-index值就會失效。
父元素{ z-index:1; } 子元素{ z-index:9999; }
在上述代碼中,當子元素在父元素內部時,子元素的z-index值會失效。因為子元素的兄弟元素是父元素,所以無論子元素的z-index值多少,它始終都不會在父元素的上層顯示。
所以,如果您希望讓元素永遠置于最頂層顯示,需要考慮到所有的兄弟元素和父元素的層疊順序和z-index值,并保證該元素的z-index值最高。同時,建議對html、body設置z-index值為0,以防止因為其他元素的z-index值過大而導致該元素被遮蓋。