CSS样式学习之路–01 背景!

背景

  CSS允许应用纯色作为背景,也允许使用背景图像创建相当复杂的效果
background

示例

index.html

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link href="demo.css" type="text/css" ref="stylesheet">
</head>
<body>
<h1>
使用样式表
</h1>
<a>a标签样式</a>
<h2>h2样式</h2>
<h3>h3样式</h3>
<p>Hello JhonRain </p>
<div class="divClass">
Hello
</div>
</body>
</html>

demo.css

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
body{
background-color: gray;
}
p{
width: 150px;
padding: 10px;
background-color: red;
}
.divClass{
background-image: url(../a.png);
#background-repeat:no-repeat/repeat/repeat-x/repeat-y/round/space/inherit;
background-repeat:no-repeat;
/** right:right和center **/
background-position: right top;


}

CSS3背景

background-size: 规定背景图片的尺寸
background-origin: 规定背景图片的定位区域
background-clip:规定背景的绘制区域

最后更新: 2018年09月26日 12:01

原始链接: http://yoursite.com/2016/03/09/CSS/CSS样式-背景/

× 请我吃糖~
打赏二维码