css中怎么让背景图居中

CSS中的背景图居中一直是前端开发者经常遇到的问题。通过以下几种方法，你可以很容易地让你的背景图片居中。

1、使用background-position属性：

body {
    background: url(your-image.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
} 

2、使用text-center属性：

body {
    background-image: url(your-image.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    text-align: center;
}
 
body:before {
    content: ';
    display: inline-block;
    vertical-align: middle;
    height: 100%;
}
 
div {
    display: inline-block;
    vertical-align: middle;
} 

3、使用flexbox技术：

body {
    display: flex;
    min-height: 100vh;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-image: url(your-image.jpg);
    background-size: cover;
} 

这些方法都是比较经典的CSS使背景图居中的方式，具体应用根据个人情况可以选择合适的方法，达到最佳效果。