背景

<!DOCTYPE html>
<html>
 <head>
  <meta charset="UTF-8">
  <title>背景</title>
  <style type="text/css">
   .bjDiv{
    width: 300px;
    height: 300px;
    border: 1px blue solid;
    /*背景颜色*/
    /*background-color: red;
    background-image: url(../AKL.jpg);*/
    /*背景平铺
     no-repeat 不平铺
     repeat-x   x轴平铺
     repeat-y   y轴平铺
     repeat   默认值  两个方向都平铺*/
    /*background-repeat: no-repeat;*/
    
    /*背景大小
      可以设置一个值 100px;
      两个值 100px  200px
      可以设置单词  contain*/
    /*background-size: 100px;*/
    /*背景位置
     一个值  10px  代表X是10 Y居中
     两个值  第一个值代表X,第二个值代表Y
     也可以给代表位置的英文,
     X left right center
     Y top  bottom center*/
    /*background-position: right bottom;*/ 
    /*复合写法*/
    background: blue url(../AKL.jpg) no-repeat 50px 50px / 200px 200px; 
  </style>
 </head>
 <body>
  <div class="bjDiv"></div>
 </body>
</html>
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容