背景颜色与背景图片

1、背景颜色

格式：background-color: 颜色;

2、背景图片

格式：background-image url(图片路径);

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>标题</title>
    <style>
        .bgc {
            background-color: blue;
            height: 200px;
        }

        .bgi {
            background-image: url(11.jpg);
            height: 200px;
        }
    </style>
</head>
<body>
<div class="bgc">背景颜色</div>
<div class="bgi">背景图片</div>
</body>
</html>

背景颜色与背景图片

3、背景图片平铺

格式：background-repeat: no-repeat/repeat/repeat-x/repeat-y;

no-repeat：不平铺;

repeat：平铺;

repeat-x：向水平方向平铺；

repeat-y：向垂直方向平铺。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>标题</title>
    <style>

        body {
            background-image: url(11.jpg);
            background-repeat: repeat-x;
        }
    </style>
</head>
<body>
</body>
</html>

背景颜色与背景图片