JSP代码:
<div class="showphoto"><div id="jqueryPic"> <table cellspacing="0" border="0" width="950" height="400" bordercolor="white"> <tr><td class="introduce"> <!--edit company introduce--> </td> <td class="introphoto"> <!-- show photo here --> <div id="photo_container"></div> </td></tr> </table> </div></div>
CSS样式:
.showphoto{ width:960px;height:420px;position:relative;z-index:1;top:50px;left:300px; background-color: #ffffff; border: 2px solid transparent; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; /*IE 7 AND 8 DO NOT SUPPORT BORDER RADIUS*/ -moz-box-shadow: 0px 0px 12px #000000; -webkit-box-shadow: 0px 0px 12px #000000; box-shadow: 0px 0px 12px #000000; /*IE 7 AND 8 DO NOT SUPPORT BLUR PROPERTY OF SHADOWS*/ opacity: 0.39; -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 39); /*-ms-filter must come before filter*/ filter: alpha(opacity = 39); /*INNER ELEMENTS MUST NOT BREAK THIS ELEMENTS BOUNDARIES*/ /*All filters must be placed together*/ } #jqueryPic{width:950px;height:400px;position:absolute;margin:10px;} .introduce{width:330px;background:url(../images/introduce01.png)no-repeat right; background-color:gray;border-right:none;color:white;font-size:16px;} .introphoto{background-color:white;border-left:none;position:relative;z-index:2;}
其中showphoto的Div有圆角边框,并且是半透明背景,而table的td里面的两个div有背景图和焦点图片。现在的效果是,showphoto的div透明背景覆盖在jqueryPic(table)上面,显得table里面的内容很朦胧。我想让showphoto显示在最底层,可是不管我怎么调z-index属性,依然无动于衷。实在是没有办法了,请各位高手,老师们指教。谢谢你们...