040.背景图像应用及渐变

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>2021-12-7</title>
        <style type="text/css">
        /*
        background: 颜色  图片 图片位置(270px   10px)  平铺方式
        
        
        */
            div{
                width: 1000px;
                height: 700px;
                border: 1px solid red;
                background-image: url(../image/pdd_logo_v2.png);/*默认是全部平铺的*/
            }
            
            .div1{
                background-repeat: repeat-x;
            }
            .div2{
                background-repeat: repeat-y;
            }
            .div3{
                background-repeat: no-repeat;
            }
        </style>
    </head>
    <body>
        <div class="div1">
            
        </div>
        <div class="div2">
            
        </div>
        <div class="div3">
            
        </div>
    </body>
</html>

 

上一篇:css盒子模型、背景简要描述


下一篇:统计字符出现次数