首页 > 网站 > WEB开发 > 正文

css 弹出层-透明层

2024-04-27 14:30:00
字体:
来源:转载
供稿:网友

CSS 弹出层-透明层

<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>透明层-弹出层</title><style>*{margin:0;padding:0;}.main{width:100%; height:1000px;} .div1{ top:0; left:0; width:100%; height:1000px; position:absolute; z-index:10;

} .div2{ width:100%; height:1000px; z-index:-1; position:absolute; /**透明层*/ background:#000000; filter:alpha(opacity=70); -moz-opacity:0.7; -khtml-opacity: 0.7; opacity: 0.7; } .div3{ margin-left:100px; width:100px; height:200px; background:yellow; }</style></head><body > <div class="main">dsadd</div><div class="div1">

<!-- 因为子元素会继承父元素的透明层opacity 所以定义一个空div作为透明层-->

<div class="div2"></div><div class="div3">wqeqwe</div></div></body></html>


发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表