zoukankan      html  css  js  c++  java
  • 背景图毛玻璃效果

    1、背景图片要充满其父元素。

    2、其父元素一局最外层元素绝对定位并设置z-index属性与filter属性;

    3、最外层元素设置一个半透明背景色。

    .header{
        position:relative;
        color:#fff;
        background-color:rgba(7,17,27,0.5);
    }
    .header .background{
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          z-index: -1;
          filter: blur(10px);
    }

      

    <div class=header>
        <div>lalala</div>
        <div class=background>
            <img src="http://static.galileo.xiaojukeji.com/static/tms/seller_avatar_256px.jp" width="100%" height="100%">
        </div>
    </div>
  • 相关阅读:
    sed
    UCOSIII(二)
    UCOSIII(一)
    IIC
    SPI
    vii
    find
    grep
    Scrum项目4.0
    Scrum项目3.0
  • 原文地址:https://www.cnblogs.com/GaoX/p/6594578.html
Copyright © 2011-2022 走看看