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

 h1 {

     background-image: url(logo.jpg), url(logo.jpg);

     background-repeat: no-repeat;

     background-position: left, right;

 }

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

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

CSS之background-image：在一个元素中设置给定数量的背景图片的更多相关文章

  1. SolidWorks在一个零件中设置不同的尺寸版本

    问题 比如想设置一系列螺丝的长度,一个一个建零件非常麻烦,希望在一个零件中设置不同的长度尺寸版本 解决 比如想设置不同的拉伸长度,右键拉伸>配置特征 可以生成新配置,设置不同的D1参数,即可生成 ...

  2. android中在java代码中设置Button按钮的背景颜色

    android中在java代码中设置Button按钮的背景颜色 1.设置背景图片,图片来源于drawable: flightInfoPanel.setBackgroundDrawable(getRes ...

  3. Android中设置控件的背景颜色的方式整理

    版权声明:本文为博主原创文章,未经博主允许不得转载. 前言 在Android开发中,经常需要设置控件的背景颜色或者图片的src颜色. 效果图 代码分析 根据使用的方法不同,划分为 setBackgro ...

  4. 在hadoop 的任务中设置 map数量

    试验了一下: 调整mapred-site.xml中mapred.min.split.size的值可以改变map的数量 首先设置了hdfs-site.xml中的dfs.block.size为20M,测试 ...

  5. android 中ImageButton按下改变背景图片的效果

    最近在做一个app的登陆界面,才发现原来认为很简单的UI效果,其实背后却蕴含的知识很多,积累一个算一个吧. 实现方法有两种:一种是添加代码,一种是配置xml文件. 方法一:代码添加 ImageButt ...

  6. jQuery获取和设置disabled属性、背景图片路径

    之前对于这个独特的disabled属性获取和设置很混乱,今天项目中用到了,用attr不能实现,于是多次试验得出: 获取disabled属性用prop $("#basic_key") ...

  7. 设置一个View的背景图片的集中方法

    控制器view的背景图片的方法, 四种: 1.直接在控制器view上添加一个imageView大小设置的和view一样 UIImageView *beijingimage = [UIImageView ...

  8. select元素中设置padding效果

    更新2016-9-17:这个bug是在mac os上的发生,在window系统中不存在这个问题! 给select元素增加:padding-left:20px;但是未生效,如下图所示: 在select上 ...

  9. jQuery通过CSS()方法给指定的元素同时设置多个样式

    <!DOCTYPE html> <html> <head> <script src="http://ajax.googleapis.com/ajax ...

随机推荐

  1. Redis及虚拟机windows两种环境安装配置

    ---恢复内容开始--- Redis  /rae  dis/是一个开源的Key-Value数据库.和Memcached类似,它支持存储的value类型相对更多,包括string(字符串).list(链 ...

  2. socket套接字基本概念

    int socket()函数创建的是套接字socket,返回的是socket描述符(套接字描述符),其实就是文件描述符,socket(套接字)其实就是文件 socket()创建了套接字(文件),只是开 ...

  3. 【学习笔记】Python 3.6模拟输入并爬取百度前10页密切相关链接

    [学习笔记]Python 3.6模拟输入并爬取百度前10页密切相关链接 问题描述 通过模拟网页,实现百度搜索关键词,然后获得网页中链接的文本,与准备的文本进行比较,如果有相似之处则代表相关链接. me ...

  4. git学习---去除版本控制

    本地这样去除文件夹 node_modules 的版本关联:执行:git rm -r --cached "node_modules/"提交: git commit -am 'remo ...

  5. Codeforces-B-Divisors of Two Integers(思维技巧)

    Recently you have received two positive integer numbers xx and yy. You forgot them, but you remember ...

  6. zabbix 告警 JXM

    告警 虚拟机上网 [root@test1 alertscripts]# route -n [root@test1 alertscripts]# route add default gw 172.25. ...

  7. 搭建 flask 应用

    参考文档:http://docs.jinkan.org/docs/flask/quickstart.html#a-minimal-application 1.使用Pycharm创建Flask应用 fr ...

  8. sass注释中有中文出现报错解决方法

    在使用koala编译sass成css过程中出现这样的报错 后来查资料说是自己在sass中的注释中有中文引起的, 解决方案: 进入C:\Ruby25-x64\lib\ruby\gems\2.5.0\ge ...

  9. Visio Studio使用总结

    1.常用快捷键: 注释:Ctrl+K+C 取消注释:Ctrl+K+U 增加缩进:Table 减少缩进: Table+Shift 格式化文本:A.  Ctrl+K+F(选中文本)  B.  Ctrl+K ...

  10. Maven 的setting.xml

    <?xml version="1.0" encoding="UTF-8"?> <!-- Licensed to the Apache Soft ...