• css3实现条纹背景


    <!DOCTYPE HTML>
    <html>
    <head>
    <meta charset='utf-8'/>
    <meta forua="true" http-equiv="Cache-Control" content="no-cache,must-revalidate,max-age=0, proxy-revalidate, s-maxage=0"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta content="yes" name="apple-mobile-web-app-capable" />
    <meta content="black" name="apple-mobile-web-app-status-bar-style" />
    <meta content="telephone=no" name="format-detection" />
    <title>背景</title>
    <style type="text/css">
    body,html{ 100%; height: 100%; margin:0 auto; height: 100%;}
    .bg{height:100%; padding:0; 100%; overflow:hidden; position:relative; background-color: #fffcf9;
    background-image: -webkit-gradient(linear, 0 0, 100% 100%,
    color-stop(.25, rgba(255, 255, 255, .2)), color-stop(.25, #f7f4f1),
    color-stop(.5, #f7f4f1), color-stop(.5, rgba(255, 255, 255, .2)),
    color-stop(.75, rgba(255, 255, 255, .2)), color-stop(.75, #f7f4f1),
    to(#f7f4f1));
    background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, .2) 25%, #f7f4f1 25%,
    #f7f4f1 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%,
    transparent 75%, #f7f4f1);
    background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, .2) 25%, #f7f4f1 25%,
    #f7f4f1 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%,
    #f7f4f1 75%, #f7f4f1);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, .2) 25%, #f7f4f1 25%,
    #f7f4f1 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%,
    #f7f4f1 75%, #f7f4f1);}
    .stripes {
    overflow:hidden;
    100%;
    /*padding:2%;*/
    height: 100%;
    float: left;
    -webkit-background-size: 8px 8px;
    -moz-background-size: 8px 8px;
    background-size: 8px 8px; /* 控制条纹的大小 */
    }
    </style>
    </head>

    <body>
    <div class="bg stripes">

    </div>
    </body>
    </html>

  • 相关阅读:
    c++ 全局变量初始化的一点总结
    新的博客
    Git常用命令总结
    git 分支 branch 操作
    状态管理Vuex
    让 markdown 生成带目录的 html 文件
    mysql安装时,提示:Failed to start service MYSQL80
    【React 资料备份】React Hook
    【React 资料备份】React v16.3之后的生命周期
    两个数组对象取并集
  • 原文地址:https://www.cnblogs.com/xiaotaiyang/p/4806401.html
Copyright © 2020-2023  润新知