CSS中opacity的使用

来源:互联网 发布:软件行业市场描述 编辑:程序博客网 时间:2024/05/20 12:23
<html><style type="text/css">    div.window{      position:absolute;      overflow:auto;        border:solid 1px gray;        width:300px;        height:200px;    }    div.titlebar{    position:absolute;    top:0px;height:18px;    width:290px;    border-bottom:groove gray 2px;    padding:3px 5px 2px 5px;    background-color:#aaa;        }        div.content{    position:absolute;    top:25px;    height:165px;    width:290px;    padding:5px;    overflow:auto;    background-color:#fff;    }  div.translucent{  opacity:.75;        }</style><body><div class="window" style="left:10px;top:10px;"><div class="titlebar">Test Window</div><div class="content">1<br>2<br>3<br>4<br>5<br>6<br>7<br>8<br></div></div><div class="window" style="left:75px;top:110px; z-index:20"><div class="titlebar">Another Window</div><div class="content translucent"style="backgroun-color:#ccc;">This is another window.Its<tt>z-index</tt> puts it on top of the other one.CSS style make its content area translucent,in browsers that support that.</div></div></body></html>

原创粉丝点击