css背景图像的属性

记得有一次，我在一个咖啡馆里，看着窗外的雨滴打在玻璃上，突然想到一个网站背景图的问题。那是2013年，我在给一个电商网站设计页面，背景图总是加载不完整。我试了各种CSS属性，比如background-size和background-position，但还是不行。
最后，我决定用background-image的cover属性试一试。结果，背景图完美覆盖了整个页面，连雨滴都清晰可见。那是我第一次真正理解cover属性的魅力。
等等，还有个事。我记得当时我查了资料，cover属性是2012年加入CSS的，那个版本是CSS3。现在想想，这已经过去快十年了，技术的进步真是惊人。
那，你有没有遇到过类似的问题，又是如何解决的？

background-image: 设置背景图像。

• background-repeat: 控制背景图像的重复方式，如 no-repeat。
• background-position: 定位背景图像的位置，如 center center。
• background-size: 设置背景图像的大小，如 cover 或 contain。
• background-attachment: 控制背景图像是否随内容滚动，如 fixed。
• background-color: 设置背景颜色，当背景图像不可见时显示。
  这就是坑：不要在背景图像大小上使用 cover 和 contain 同时，否则效果不可预测。
  实操提醒：测试背景图像在不同设备上的显示效果，确保兼容性。