CSS实现遮挡无法点击效果

最新推荐文章于 2025-01-09 20:27:55 发布

原创最新推荐文章于 2025-01-09 20:27:55 发布 · 432 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#CSS #IE #Firefox

CSS 专栏收录该内容

1 篇文章

订阅专栏

本文介绍了一种使用CSS实现的页面遮罩效果，通过设置绝对定位和透明度，使得黑色遮罩层能够覆盖整个屏幕，并确保用户无法点击底层元素。

<style type="text/css">
	.black_overlay{
		position: absolute;
		top: 0%;
		left: 0%;
		width: 100%;
		height: 100%;
		background-color: black;
		z-index:1000;//使其div在高层，用户无法点击底层事件.
    	        opacity:.2;//支持firefox
    	        filter: alpha(opacity=20);//支持ie
       }
</style>
<div id="fade" class="black_overlay"></div>