zoukankan      html  css  js  c++  java
  • IE6滤镜在实战测试中能让父层里面的子元素产生阴影

    1、写法一:

    <div class="cornerbg">
        <p class="title-file">------</p>

    ......

    </div>

    .cornerbg{ 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{ 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;
                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文件引用不到,无效

  • 相关阅读:
    Java设计模式之单例模式
    Bootstrap-table使用footerFormatter做统计列
    Bootstrap进度条
    基于Bootstrap的表格插件bootstrap-table
    基于Bootstrap的对话框插件bootstrap-dialog
    基于Bootstrap的下拉框插件bootstrap-select
    JsonConfig处理日期时间
    Jquery表单验证插件validate
    Hibernate使用Criteria去重distinct+分页
    设置iframe高度自适应屏幕高度
  • 原文地址:https://www.cnblogs.com/koleyang/p/5283698.html
Copyright © 2011-2022 走看看