css中怎样将背景图片平铺

admin 轻心小站 关注 LV.19 运营
发表于前端技术学习版块 css,教程

CSS中怎样将背景图片平铺在CSS中,我们可以使用background属性来添加背景图像。但是,有时候我们的背景图片并不是很大,无法填充整个背景,那么我们就需要这个背景图片进行平铺。下面就是一些实现方

CSS中怎样将背景图片平铺
在CSS中,我们可以使用background属性来添加背景图像。但是,有时候我们的背景图片并不是很大,无法填充整个背景,那么我们就需要这个背景图片进行平铺。下面就是一些实现方法。
1. repeat
使用“repeat”属性值来平铺背景图片,将图像在水平和垂直方向上平铺。
css
background-repeat: repeat; 

2. repeat-x
使用“repeat-x”属性值,只让背景图片在水平方向上平铺。
css
background-repeat: repeat-x; 

3. repeat-y
使用“repeat-y”属性值,只让背景图片在垂直方向上平铺。
css
background-repeat: repeat-y; 

4. no-repeat
使用“no-repeat”属性值,不让背景图片平铺。
css
background-repeat: no-repeat; 

下面是一个完整的例子:
css
/* 设置背景图片 */
body {
  background-image: url("example.jpg");
  
  /* 平铺背景图片 */
  background-repeat: repeat;
} 

以上是CSS中怎样将背景图片平铺的一些方法,根据实际需要选择合适的方法即可。

文章说明:

本文原创发布于探乎站长论坛,未经许可,禁止转载。

题图来自Unsplash,基于CC0协议

该文观点仅代表作者本人,探乎站长论坛平台仅提供信息存储空间服务。

评论列表 评论
发布评论

评论: css中怎样将背景图片平铺

粉丝

0

关注

0

收藏

0

已有0次打赏