Ⅰ 如何實現一開網頁就實現頁面遮罩

在<body>標簽里加入這樣一個層：
<div
style="position:absolute;z-index:100;width:100%;height:100%;background-color:#999;filter:Alpha(Opacity=50)"></div>
注意：這個效果要設置瀏覽器允許運行活動內容

Ⅱ 關於html遮罩代碼的問題

你可以用css中的:hover偽類，比如：
img.mask{
opacity:1;
}
img.mask:hover{
opacity:0;
}
這樣，當你把滑鼠放到<img class="mask" src="遮罩圖片" />上的時候，圖片會變得透明，滑鼠移開，圖片就變得不透明。

純手打，無JS，望樓主點贊

Ⅲ CSS遮罩層不能完全遮罩頁面

CSS遮罩層不能完全遮罩頁面，是設置錯誤造成的，解決方法如下：內

1、先看下html，一個img圖片控制項，容和一個有mask樣式的div，裡面有文字，這個就是遮罩層。

Ⅳ html5如何實現彈出提示框，並且伴隨遮罩層並且可以關閉彈出框

通過jquery的show()和hide()函數聯合使用，實現彈出窗口。

一、show（）和hide（）函數解析：

1、show() 方法顯示隱藏的被選元素。

注意：show() 適用於通過 jQuery 方法和 CSS 中 display:none 隱藏的元素（不適用於通過 visibility:hidden 隱藏的元素）。

2、hide() 方法隱藏被選元素。

這與 CSS 屬性 display:none 類似，但是隱藏的元素不會被完全顯示（不再影響頁面的布局）。

二、設計一個HTML頁面，包括一個簡單的彈出窗，和一個顯示按鈕。其中，調用了jquery的以上兩個函數。具體代碼如下：

Ⅳ 請問有誰知道設計網頁遮罩css跟html的代碼怎麼寫 就是點擊之後彈出個小窗口然後背景色變暗的那種急急急啊

HTML：
<p class="shade"></p>
<div class="tanceng">
<p class="cue">親，活動還在繼續，5月6日-5月8日抽獎，要累計50萬以上才可參加哦~</p>
<p class="okbtn pt5">
<a href="javascript:void(0);">確定</a>
</p>
</div>

CSS：
.shade{
width: 100%;
background-color: rgba(0,0,0,0.3);
position: fixed;
left: 0;
top: 0;
display: none;
}
.tanceng{
background-color: #ffeb8d;
width: 240px;
padding: 20px;
line-height: 200%;
color: #f31b33;
position: fixed;
top: 20%;
left: 50%;
border-radius: 0.6rem;
margin-left: -140px;
display: none;
}
.okbtn a{
display: block;
width: 80%;
background-color: #f31b33;
color: #fff;
line-height: 250%;
font-size: 16px;
text-align: center;
border-radius: 5px;
margin:0 auto;
}

JS:
var webH = $(window).height();
//這里顯示遮罩
$("#inner").click(function(e){ //#inner就是你要點擊出現遮罩的按鈕
$(".shade,.tanceng").css("display","block");
$(".shade").height(webH);
$(".cue").html("親，活動還在繼續，5月6日-5月8日抽獎，要累計購買50萬以上才可參加哦~");
//這個可以不要，這是我自己的東西
});
//這里隱藏遮罩
$(".okbtn").click(function(e){
$(".shade,.tanceng").css("display","none");
$(".shade").height(0);
})

Ⅵ HTML實現遮罩層方法 HTML中如何使用遮罩層

最普遍的做法遮罩層默認display:none;需要彈出的場景display:block;關閉遮罩層display:none;

Ⅶ HTML中如何使用遮罩層

第一步：新建一個html頁面

頁面中先做出一個【領紅包】的按鈕，如圖（圖中左側是效果右側是代碼），點擊這個按鈕就會彈出一個紅包的活動消息，即我們要的遮罩效果
css遮罩層怎麼做
css遮罩層怎麼做

第二步：做出遮罩層

遮罩層的作用就是將層後面的內容都遮住，覆蓋全屏，所以：

寬高都設為：100%；

位置 position：absolute；left：0； top:0;

背景色 一般都設為透明的 background: rgba(0,0,0,0.5);

層的順序 z-index:100; (設置一個比較大的數值)
css遮罩層怎麼做

第三步：做出遮罩層上的內容

1、在遮罩層上添加活動效果圖

2、關閉活動信息彈出框的【關閉】按鈕

注意:遮罩層上的內容也要添加上z-index且數值要比遮罩層的大，z-index:101

如圖（左側效果，右側代碼）
css遮罩層怎麼做
css遮罩層怎麼做

第四步：用js實現遮罩效果演示

首先我們看到的頁面上是沒有遮罩層的，只有一個【領紅包】的按鈕在頁面中；

然後我們點就【領紅包】按鈕，就彈出遮罩效果；再要關閉遮罩層時點擊右上角的關閉按鈕，就退出了遮罩成的活動信息。具體操作如下：

1、將遮罩層隱藏起來 display：none；

2、點擊【領紅包】時，遮罩層顯示 display：block;

3、點擊關閉按鈕，遮罩層消失 display：none；

如圖
css遮罩層怎麼做
css遮罩層怎麼做
css遮罩層怎麼做
css遮罩層怎麼做
css遮罩層怎麼做

Ⅷ html的局部遮罩效果怎麼做

有種很笨的方法，就是你看到的透明的那個框壓根就不是真正被挖空了，它只是浮在透明層上的另一個層或者壓根就是頁面中的那個層，只是位置沒有發生改變而已。

Ⅸ html如何讓DIV遮蓋視頻

設置視頻的透明度，在設置z-index的值
<object>...</object>標簽內部加入一個參數「<param name="wmode" value="transparent">」

Ⅹ html 遮罩蒙版有很多個怎麼設置層級關系

position: relative; ///必須定位z-index地能生效。
z-index:9; ////這里是設置層級。