1、写法一:
<div class="cornerbg">
<p class="title-file">------</p>
......
</div>
.cornerbg{width: 992px;height: 659px;background: #fff;border-radius: 10px;box-shadow: 0px 0px 20px #777;margin: 14px auto;filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=0,OffY=0,Color='#909090',Positive='true',gradientType= '10');}
实战项目中让子元素p里面的文本产生了阴影。
2、写法二:
<div class="cornerbg">
<p class="title-file">------</p>
......
</div>
.cornerbg{width: 992px;height: 659px;background: #fff;border-radius: 10px;box-shadow: 0px 0px 20px #777;margin: 14px auto;filter:progid:DXImageTransform.Microsoft.Shadow(color=#909090,direction=120,strength=4);}(推荐)
实战项目中让子元素p里面的文本产生了阴影。
3、最佳实践——还是推荐使用PIE.htc插件来实现IE6下的div层阴影和圆角效果
<style type='text/css'>
.cornerbg{
background: #fff;
width: 992px;
height: 659px;
border-radius: 8px;
box-shadow: 0px 0px 10px #B2C3D1;
margin: 14px auto;
position: relative;
top: 14px;
behavior: url("__STATIC__/yjj/css/PIE.htc");
}
</style>
但要注意上面的样式代码写的位置一定要在html文档内,不能写到外面的css文件中用link引用,否则PIE.htc文件引用不到,无效