如何将背景图像放置在另一个背景图像的确切中心

时间:2018-08-30 01:56:38

标签: css

我想将背景图像放置在另一个背景图像的精确中心,但是我不确定该如何处理。

我的html如下

<body>
    <div class="bg">
    </div>
</body>

我的CSS是:

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}


html, body {
        height: 100%;
        margin: 0px;
        font-family: Raleway, sans-serif;
}

.bg {
    height: 100%;
    background-image: url('../images/mississauga.jpg');

    background-repeat: no-repeat;
    background-size: cover, ;
    background-position: center;
}

预先感谢

1 个答案:

答案 0 :(得分:1)

 /*use this in html may be it will work 
         <body>
   <div class="bg">
        <div class="bg1">
        </div>
      </div>
   </body> */


   * {
       margin: 0;
       padding: 0;
        box-sizing: border-box;
     }

     html, body {
    height: 100%;
    margin: 0px;
    font-family: Raleway, sans-serif;

}

    .bg {
      height: 100%;
       background-image: url('../images/mississauga.jpg');

       background-repeat: no-repeat;
          background-size: cover, ;
         background-position: center;
        }

     .bg1
       { width:100%;
         height:100%;
           background: url('../images/mississauga.jpg') no-repeat center center;


          }