HTML元素的顯示優先順序

2021-07-25 15:12:51 字數 1317 閱讀 2351

一、html元素的顯示優先順序(顯示層次問題,哪個在上哪個在下!

總是顯示在最前面)

幀元素》html元素優先,表單元素總》非表單元素優先

html中常用的

表單元素包括:文字區域(textarea),列表框(select),文字輸入框,密碼輸入框,單選輸入框,複選輸入框等等。常見的

非表單元素包括:鏈結標記(a),div標記,span標記,table標記等等。表單元素覆蓋樣式元素的根本原因在於html元素預設的顯示優先順序規則。

所有這樣html元素又可以根據其顯示要求分成兩類,即有視窗的html元素(windowed element),無視窗的html元素(windowless element)。有視窗的元素包括:select元素,object元素,外掛程式,ie5.01以主更早版本中的iframe元素。無視窗的元素包括:大多數的普通html元素,如鏈結和table標記,除了select元素之外的大多數表單元素。

二、瀏覽器型別與顯示優先順序

按照瀏覽器型別比較,html元素的顯示次序也有所不同,總結如下:

⑴ netscape/mozilla

在ns瀏覽器6.0以前的版本中,表單元素總是比其他html元素有更高的優先順序。但在ns 6+瀏覽器中,iframe元素和所有表單元素的顯示次序或者由css的z-index屬性值確定,或者由它們在html頁面中出現的次序確定,但select元素除外。

(2)netscape/mozilla

在ns瀏覽器6.0以前的版本中,表單元素總是比其他html元素有更高的優先順序。但在ns 6+瀏覽器中,iframe元素和所有表單元素的顯示次序或者由css的z-index屬性值確定,或者由它們在html頁面中出現的次序確定,但select元素除外。

⑶ opera

在最新的opera(7.10*)瀏覽器中,包括select在內的所有表單元素根據z-index屬性或它們在html頁面中的出現次序來確定顯示優先順序。但是,最新的opera瀏覽器不將iframe作為無視窗元素顯示,iframe被看做有視窗元素,在顯示次序上要比所有無視窗元素優先。

三、css的z-index屬性

我們知道,css的z-index屬性可以用來控制任意html元素顯示時的覆蓋次序。當多個html元素重疊在同一空間中時,z-index值較大的元素將覆蓋z-index值較小的元素。

但z-index屬性值不是萬能的。如前所述,有視窗的元素總是顯示在無視窗元素的前面,z-index屬性值只有在同一類元素之間才起決定作用。形象地說,有視窗元素和無視窗元素就像畫在同一瀏覽器視窗的兩塊不同畫布上,兩類元素分別自成體系,它們的z-index屬性也只相對於同一畫布上的其他元素起作用。

html中元素的顯示優先順序

在html中,html中的元素一般劃分為幀元素 表單元素 非表單元素。幀元素 frameset 的優先順序最高,表單元素比非表單元素的優先順序要高。優先順序 幀元素 frameset 表單元素 非表單元素 表單元素包括 文字輸入框,密碼輸入框,單選框,核取方塊,文字輸入域,列表框等等 非表單元素包括...

html頁面元素優先順序問題 z index

在開發中曾經遇到過z index帶來的頁面層級遮蓋問題。原帖太亂了,就發個效果圖吧。div被select隱藏的問題可以用乙個 的iframe來解決。div,select,iframe都是絕對定位的情況下進行的。在絕對定位的情況下,z index是可以對他們起到作用的。但是在頁面布局實際中都是用相對進...

CSS 優先順序 偽元素

當我們寫css的時候我們必須注意有些選擇器在級聯 cascade 上會高於其它選擇器,我們寫在最後面的選擇器將不一定會覆蓋前面我們寫在同乙個元素的樣式。那麼你如何計算指定選擇器的優先順序?1.第乙個數字 a 通常就是0,除非在標籤上使用style屬性 2.第二個數字 b 是該選擇器上的id的數量的總...