<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>表格</title>
<style type="text/css">
.class1{
width: 400px;
height: 550px;
border-style: groove;
border-color: rgba(235,198,118,0.6);
border-width: 10px;
padding: 30px;
background-image: url(../image/img2.jpg),url(../image/img3.jpg),url(../image/img4.jpg);
background-repeat: no-repeat,no-repeat,repeat;/*背景图片不重复*/
background-position: top left,bottom right,top center;/*右下背景图片的位置*/
background-origin: border-box,padding-box,content-box;/*左上背景图片的定位*/
background-clip: border-box,padding-box,content-box; /*中间背景图片裁剪*/
}
p{
font-size: 20px;
text-indent: 2em;/*首行缩进2个字符*/
line-height: 28px;
padding-top: 12px;
}
</style>
</head>
<body>
<div class="class1">
<p>大家好。这是一个css3添加背景图片的小案例。需要注意的是：1.在添加多个背景的时候，底层的背景图要放在最后面。2，多个背景之间的属性用逗号分割。</p>
</div>
</body>
</html>
