css半透明层

最新推荐文章于 2022-04-19 23:21:02 发布

原创最新推荐文章于 2022-04-19 23:21:02 发布 · 194 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#CSS #IE

CSS 专栏收录该内容

8 篇文章

订阅专栏

本文介绍了一个用于网站首次登录时显示的提示层的CSS样式实现。该样式包括了两个主要部分：一个是覆盖整个页面背景的半透明层，另一个是位于中央的提示信息层。通过使用不同的透明度设置确保了在IE和FF浏览器下的兼容性。

    首次登录弹出提示层，主要有两个层：半透明层，遮住下面的内容；提示层（主要内容），下面为这两个层的css样式。针对IE透明使用的是filter:alpha(opacity=35)，针对FF透明的相关代码是opacity:0.35，这样至少在IE和FF下是兼容的，通过测试。

.mask {
	border:0px;
	background:#000;
	width:100%;
	height:1210px;
	margin:0px;
	z-index:999;
	padding:0px;
	position:absolute;
	top:0px;
	left:0px;
	filter:alpha(opacity=35);	
	opacity:0.35;	
}
.mask_prompt {
	position:absolute;
	z-index:1000;
	width:486px;
	height:307px;
	left:50%;
	top:50%;
	margin:-153px 0 0 -243px;
	background:url(../images/prompt_bj.png) no-repeat;
}