css零到一基础教程012：CSS 背景重复

最新推荐文章于 2024-06-13 15:16:00 发布

慕容屠苏

最新推荐文章于 2024-06-13 15:16:00 发布

阅读量281

点赞数

分类专栏： css零到一文章标签： css html 前端

本文链接：https://blog.csdn.net/kerryqpw/article/details/123585659

版权

css零到一专栏收录该内容

98 篇文章 2 订阅 ¥49.90 ¥99.00

订阅专栏

超级会员免费看

这篇教程介绍了CSS中关于背景图像的重复与定位。默认情况下，背景图像在水平和垂直方向重复，但可以使用`background-repeat`属性设置为`repeat-x`或`repeat-y`以限制重复方向，或者设为`no-repeat`阻止重复。此外，`background-position`属性允许调整背景图像的位置，例如将其置于右上角。

摘要由CSDN通过智能技术生成

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>