首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > CSS >

css兑现shadow窗口

2012-09-21 
css实现shadow窗口?/*关键点: 1 半透明的兼容写法:opacity:0.5,filter:alpha(opacity:50) 2 z-index:要想

css实现shadow窗口

?

/*关键点: 1 半透明的兼容写法:opacity:0.5,filter:alpha(opacity:50); 2 z-index:要想z-index起作用必须给dom元素添加position:absolute; 3 窗口遮挡效果的实现:shadow的div添加:display="display" 不是disabled */

?

<html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>shadow窗口</title><style>.shadow{opacity:0.5 !important;/*关键*/padding:0px;margin:0px;position:absolute;/*关键*/top:0px;left:0px;z-index:100;/*关键*/width:100%;height:100%;background:gray;/*关键*/filter:alpha(opacity:50);/*关键*/}</style></head><body style="border:1px solid red;padding:0px;margin:0px;"><div readonly="readonly"></div><input type="button" value="alert('aaaaaaaaaaa')" onclick="alert('aaaaaaaaaaa')"><div style="z-index:20000;position:absolute;top:20%;left:30%;"><input type="button" value="alert('bbbbbbbbbbbbbb')" onclick="alert('bbbbbbbbbbbbbb')"></div></body></html>

热点排行