微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

将背景属性重构为一行使图像消失

如何解决将背景属性重构为一行使图像消失

我正在尝试清理我的 CSS 以获取背景属性。当我单独列出每个属性时,一切都按预期工作。但是,当我尝试将其重构为一行时,图像消失了。我相信它与 background-size 属性有关,但我无法在重构的解决方案中弄清楚。任何帮助将不胜感激!

工作代码

.bg {
  content: "";
  height: 100vh;
  background-image: url("../../assets/mountain.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  opacity: 0.9;
}

尝试重构

.bg {
  content: "";
  height: 100vh;
  background: url("../../assets/mountain.jpg") center cover no-repeat;
  position: relative;
  opacity: 0.9;
}

解决方法

这应该有效:

background: url("../../assets/mountain.jpg") no-repeat center / cover;

background-size 需要以“/”字符开头(我认为它需要放在最后)。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。