91超碰碰碰碰久久久久久综合_超碰av人澡人澡人澡人澡人掠_国产黄大片在线观看画质优化_txt小说免费全本

溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

css實現彈出對話框同時出現遮罩層的方法

發布時間:2020-10-22 14:50:15 來源:億速云 閱讀:152 作者:小新 欄目:web開發

這篇文章主要介紹了css實現彈出對話框同時出現遮罩層的方法,具有一定借鑒價值,需要的朋友可以參考下。希望大家閱讀完這篇文章后大有收獲。下面讓小編帶著大家一起了解一下。

最近的項目有留言板彈出對話框,然后我就自己寫了一個靜態的,下面就直接上代碼:

<p class="fade"></p>
<p class="succ-pop">
	<h3 class="title">
		這里是要填寫的內容
	</h3>
</p>
/*灰色遮罩層*/
.fade {
   width: 100%;
   height: 100%;
   background: rgba(0, 0, 0, 0.5);
   position: fixed;
   left: 0;
   top: 0;
   z-index: 2;
}
/*彈出層*/
.succ-pop {
   width: 400px;
   height: 300px;
   background: #fff;
   position: fixed;/*這里的定位可以根據自己喜好選擇absolute或者fixed*/
   left: 50%;	
   top: 50%;/*這里的top根據自己的需要定*/
   margin-left: -200px;
   margin-top: -150px;
   z-index: 3;
   border-radius: 5px;
   box-shadow: 0 1px 3px rgba(0,0,0,.3);
}
.succ-pop h3.title {
   text-align: center;
   color: lightskyblue;
}

如果你不希望有彈框的時候頁面還會滾動,那就加上$('body').css('overflow-y','hidden');就可以了。

感謝你能夠認真閱讀完這篇文章,希望小編分享css實現彈出對話框同時出現遮罩層的方法內容對大家有幫助,同時也希望大家多多支持億速云,關注億速云行業資訊頻道,遇到問題就找億速云,詳細的解決方法等著你來學習!

向AI問一下細節

免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。

AI

镇江市| 阿巴嘎旗| 稻城县| 西峡县| 杨浦区| 永清县| 金溪县| 大连市| 拉孜县| 望谟县| 鹤壁市| 辛集市| 兴文县| 大兴区| 平阳县| 齐河县| 大冶市| 达日县| 玛沁县| 镇原县| 顺义区| 囊谦县| 旺苍县| 潼南县| 米脂县| 五指山市| 长春市| 义乌市| 富川| 桐梓县| 东山县| 赣榆县| 青龙| 武陟县| 鸡泽县| 阳朔县| 焉耆| 纳雍县| 潜江市| 历史| 政和县|