欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

CSS之background-image:在一个元素中设置给定数量的背景图片

程序员文章站 2022-04-11 21:30:01
众所周知,可以通过设置background-repeat的值来改变背景图片的重复次数。但有一个问题,background-repeat的值不是让图片只有1个,就是让图片铺满。如果只想设置给定数量的图片该怎么办?以2个为例,请看代码: 这样,就实现了

元素的最左边有一个logo.jpg、最右边也 ......

众所周知,可以通过设置background-repeat的值来改变背景图片的重复次数。但有一个问题,background-repeat的值不是让图片只有1个,就是让图片铺满。如果只想设置给定数量的图片该怎么办?以2个为例,请看代码:

1 h1 {
2     background-image: url(logo.jpg), url(logo.jpg);
3     background-repeat: no-repeat;
4     background-position: left, right;
5 }                  

这样,就实现了<h1>元素的最左边有一个logo.jpg、最右边也有一个logo.jpg。

设置3个、4个、5个等任意给定数量的方法同理。