13 图片背景和渐变-526互联

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>背景图片</title>
    <style>


        body{
            background-image: linear-gradient(19deg, #5a99a8 0%, #a2148f 100%);
        }
        /*渐变*/
        /*默认全部平铺,可以修改*/
        div{
            width: 1000px;
            heigth: 700px;
            border: 1px solid red;
            background-image: url("images/爱莉希雅.jpg");
        }
        #nav1{
            background-repeat: repeat-x;
        }
        #nav2{
            background-repeat: repeat-y;
        }
        #nav3{
            background-repeat: no-repeat;
        }

    </style>
</head>

<body>

<div id="nav1"><h1>aaa</h1></div>
<div id="nav2"> <h1>aaa</h1>  </div>
<div id="nav3"> <h1>aaa</h1>  </div>
</body>

</html>