CSS 的背景
1、背景颜色
属性 background-color
取值：合法的颜色值
注意：背景颜色是从border位置处开始绘制（相当于在边框、内边距和内容区域上充满）
2、背景图像 background-image
取值：url（图片路径）
3、背景图像平铺 background-repeat
| 取值 | 说明 |
|---|---|
| repeat | 默认值，横向和纵向都平铺 |
| no-repeat | 不平铺 |
| repeat -x | 横向平铺 |
| repeat-y | 纵向平铺 |
4、背景图像尺寸 background-size
取值：width，height 取值以px 为单位，或者以百分比为尺寸
5、背景图像定位 background-position
| 取值 | 说明 |
|---|---|
| x y （以px为单位的数值） | x：水平偏移位置，y：垂直偏移位置（正负控制偏移方向） |
| x y（百分比） | 0% 0%(左上角)，100% 100%（右下角），50% 50% （居中） |
| x y（关键字） | x：left / center / right；y：top / center / bottom |
6、背景属性 background
取值：color url() repeat position；
例如：background:url(a.jpg) no-repeat 35px center
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>df
#d1{
width: 400px;
height: 400px;
border: 2px solid #000000;
box-sizing: border-box;
background-image:url("https://avatar.csdnimg.cn/7/8/5/1_weixin_43883022.jpg");
background-repeat:no-repeat; /* 不平铺 */
background-size:50% 50%; /* 图片大小为图框的 1/4 */
background-position:100px 100px
}
</style>
</head>
<body>
<div id="d1"></div>
</body>
138
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
