Div+Css實現屏蔽效果的方法是什麼

歡迎大家在這裡學習Div+Css實現屏蔽效果的方法!這裡是我們給大家整理出來的精彩內容。我相信，這些問題也肯定是很多朋友在關心的，所以我就給大家談談這個!總而言之，就是當某一事件被觸發時,例如 按鈕點擊事件 。使一個事先定義好的div 顯示， 並用Css控制位置，其中的z-index屬性必須有，值賦的越大，說明此div層在重疊時，在最上面。

其中要注意的地方：

【遮罩層的大小】

1、用JS判斷你的顯示器分辨率，獲取長與寬兩個參數，將這兩個參數賦給第二層的Div，作為他的長與寬的像素值，這樣的話，無論在多大或多小的顯示器上，都可以顯示同樣的效果

2、CSS樣式表：這種方法，只能提前設置好遮罩層的長與寬了，但是就會出現一些問題：如果你的遮罩層設置的寬度、長度很大，那麼在小顯示器上就會出現浏覽器的滾動條～～反之則會出現遮罩不上的問題

因為做HTML模型，所以我用的第二種方法，有個不太合理解決的方式：我把浏覽器的下方(橫向的)滾動條給禁用掉了。代碼是： 在CSS樣式表中寫入 html,body { overflow-x:hidden;}

【遮罩層樣式】1、三個Div層的樣式，position都要設為absolute;，因為只有設為absolute時， z-index：屬性才會生效!

2、半透明屬性：filter:alpha(opacity=50); IE專有屬性， 設置層的透明度為 50% ，

-moz-opacity:0.5;    火狐FF 專有屬性，設置層的透明度為 50%。

這兩條屬性都要加上，因為IE、火狐對其中的單一一條並不兼容～～～

還有一點，你的遮罩層樣式中，一定要設置 width 與 height   ，否則 透明屬性不起效～～

3、 z-index： 的順序，   z-index：屬性的值越小，則該層越在下方，最小值是1

好了，Div+Css實現屏蔽效果的方法內容就給大家介紹到這裡了。希望大家繼續關注我們的網站!

相關推薦：

div中英文無法自動換行的解決辦法介紹