1. 程式人生 > >css-背景屬性

css-背景屬性

一、css背景屬性

(1)background-color 背景顏色

(2)background-image:url(“背景圖片地址URL”)

(3)background-repeat: 圖片是否平鋪值:

①repeat 預設 x軸 y軸 都平鋪

②no-repeat 不平鋪

③repeat-x x軸平鋪 y軸不平鋪

④repeat-y y軸平鋪 x軸不平鋪

(4)background-position: 圖片的位置

一個值 代表 x軸的位置

兩個值 第一個值代表x軸 第二個值 代表 y軸

注意: 圖片的開始點 (0,0) 點 是從圖片的左上角開始算起 跟標籤沒有關係

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>css 背景元素</title>
    <style type="text/css">
        #ad{
            width: 200px;
            height: 200px;
            background-color: red;
            background-image: url("1.jpg");
            background-repeat: repeat;
        }
    </style>
</head>
<body>
    <div id="ad">

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