css中position absolute relative 以及filter的综合小应用

我就简单写个例子拉：(在图片下面浮上一层div，并且是半透明的效果)

.out_div{

width:154px;

 border:1px solid #ccc;

display:block;

height:400px;

}

.img_div{

positon:relative;

zoom:1;

}

img{

width:150px;

padding:2px;

}

.f_div{

position:absolute;

bottom:0;

width:99%;

left:2px;

height:24px;

line-height:18px;

background-color:#ccc;

opacity:0.5;

text-indent:5px;

color:#ff0000;

filter:alpha(opacity=50);

}

<div class="out_div">

        <div  class="img_div">

                <img src="../imagenew/tx.jpg" /></br>

                <div class="f_div">

                            aaaaaaaaaaaaaaaaaaa

                </div>

         </div>

         <div style="height:30px; padding-top:5px; position:relative;s">

            详细信息

         </div>

</div>

 

仔细琢磨下position中relative,absolute的用法其实也就那几样关键是自己去领会。

opacity是设置透明度的，一般在ff下能出效果，在ie下不兼容，不过ie兼容filter:alpha(opacity=50);这两个是相当的都设置透明度。

唉，没事干就写个css玩玩了，加班好无聊啊！！！