CSS 背景重复

最新推荐文章于 2021-11-20 17:32:30 发布

い风花の雪栎

最新推荐文章于 2021-11-20 17:32:30 发布

阅读量2.3k

点赞数 1

分类专栏：笔记

本文链接：https://blog.csdn.net/XRTONY/article/details/115214332

版权

笔记专栏收录该内容

90 篇文章 0 订阅

订阅专栏

CSS 背景重复

文章目录

CSS 背景重复

CSS background-repeat
默认情况下，background-image 属性在水平和垂直方向上都重复图像。
某些图像应只适合水平或垂直方向上重复，否则它们看起来会很奇怪，如下所示：

<!DOCTYPE html>
<html>
<head>
<style>
body {
  background-image: url("/i/css/gradient_bg.png");
}
</style>
</head>
<body>

<h1>Hello World!</h1>

<p>奇怪的背景图片...</p>

</body>
</html>

在水平方向重复。

<!DOCTYPE html>
<html>
<head>
<style>
body {
  background-image: url("/i/css/gradient_bg.png");
  background-repeat: repeat-x;
}
</style>
</head>
<body>

<h1>Hello World!</h1>

<p>在这里，背景图像仅在水平方向上重复！</p>

</body>
</html>