多语言展示
当前在线:1139今日阅读:84今日分享:32

css如何把两个背景图片分别放在右上角和右下角

在css中,可以在background属性中通过right top和right bottom设置两张背景图片在右上角和右下角。下面小编举例讲解css如何把两个背景图片分别放在右上角和右下角。
工具/原料
1

html+css

2

代码编辑器:zend studio 10.0

方法/步骤
1

新建一个html文件,命名为test.html,用于讲解css如何把两个背景图片分别放在右上角和右下角。

2

在test.html文件内,使用div标签创建一个模块,用于测试。

3

在test.html文件内,给div标签添加一个class属性,用于下面设置div样式。

4

在css标签内,通过class设置div标签的样式,定义其宽度为300px,高度为300px,边框为1px。

5

在css标签内,再使用background属性设置div的背景,分别使用两张图片,利用right top和right bottom设置两张背景图片在右上角和右下角。

6

在浏览器打开test.html文件,查看实现的效果。

总结:

1、使用div标签创建一个模块。2、在css中,使用background属性设置div的背景,分别使用两张图片,利用right top和right bottom设置两张背景图片在右上角和右下角。

推荐信息