Question

我在导航栏下将图像作为全屏背景居中时遇到麻烦。这是我目前正在使用的代码。

header{
  background-image: url("design.jpg");
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  height: 100%
}

Answer 1

类似于代码的简单方法是

html { 
  background: url(images/bg.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

还有其他一些技巧，您可以从这里获得

https://css-tricks.com/perfect-full-page-background-image/

希望有帮助。

-NBaua

如何在页面上居中放置背景图片？

1 个答案: