1 <!-- 属性解释：background属性是CSS中应用较多的，且比较重要的一个属性，它负责给盒子设置背景图片和背景颜色，background是一个符合属性，它可以分解成如下几个设置项： 2 1、background-color：设置背景颜色 3 2、background-image：设置背景图片地址 4 3、background-repeat：设置背景图片如何重复平铺 5 4、background-position：设置背景图片的位置 6 5、background-attachment：设置背景图片是固定还是随页面滚动 --> 7 <!DOCTYPE html> 8 <html lang="en"> 9 <head> 10 <meta charset="UTF-8"> 11 <title>Document</title> 12 <style type="text/css"> 13 .con{ 14 width: 200px; 15 height: 200px; 16 border: 1px solid black; 17 margin: 50px solid 0; 18 /*background-image: url(图片1.png);*/ 19 /*background-repeat: no-repeat;*/ 20 /* 有四个属性： 21 1.repeat-x 只平铺x方向 22 2.repeat-y 只平铺y方向 23 3.no-repeat 只平铺一次 24 4.repeat 缺省值，平铺所有 */ 25 /*background-position: center top;*/ 26 /*background-position: 20px 10px;*/ 27 /*水平方向： left right center 28 垂直方向： top right botton 29 或者使用像素*/ 30 31 background: url(图片1.png) -82px -84px no-repeat #FFF; /* 常用写法 */ 32 } 33 </style> 34 </head> 35 <body> 36 <div class="con"></div> 37 </body> 38 </html>