第四十二节 blackground属性 

 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>

 

posted @ 2020-03-05 23:29  kog_maw  阅读(414)  评论(0)    收藏  举报