[分享]css内添加固定背景图片

CSS内添加固定背景图片可以为网页增加更多的视觉效果，使页面更加生动、有趣。下面让我们来看一下如何使用CSS内添加固定背景图片。/ 可以使用以下代码将背景图片固定在页面上 / body { backg...

CSS内添加固定背景图片可以为网页增加更多的视觉效果，使页面更加生动、有趣。下面让我们来看一下如何使用CSS内添加固定背景图片。

/* 可以使用以下代码将背景图片固定在页面上 */
body {
  background: url("image/background.jpg") fixed;
  background-size: cover;
}
/* 可以使用以下代码改变固定背景图片的位置 */
body {
  background: url("image/background.jpg") fixed center;
  background-size: cover;
}
/* 可以使用以下代码改变固定背景图片的重复模式 */
body {
  background: url("image/background.jpg") fixed center no-repeat;
  background-size: cover;
}
/* 可以使用以下代码改变固定背景图片的大小 */
body {
  background: url("image/background.jpg") fixed center no-repeat;
  background-size: 100% 100%;
} 

在以上代码中，我们可以学到如何使用CSS将一张图片固定在网页的背景上面。我们可以使用background属性来设置背景相关的属性，比如图片路径、位置、重复等等。

同时，我们还可以使用background-size属性来控制背景图片的大小。比如cover表示背景图像要尽可能的覆盖整个容器，保持图像的纵横比例，因此可能只显示图像的一部分，某些部分可能会被裁剪。另外，我们还可以用具体的数值来设置背景图片的宽和高。

总的来说，通过CSS内添加固定背景图片，我们可以在网页中添加更多的视觉元素，让页面更加丰富有趣。