CSS代码怎么把小图片设为背景图

html-css020

CSS代码怎么把小图片设为背景图,第1张

01

首先看下html代码,一个空的div,什么内容都还没放上。

02

为这个div写上一些美化的样式。

03

刷新页面,看下效果,现在就是显示一个有边框的div。

04

要用css为这个div加上背景图片,只需要加上background-image的样式,后面的值就是图片的地址了。

background-image: url(12.jpg)

05

刷新页面看下现在的效果,可以看到div已经加上图片背景了。

1、可以同时使用背景色和背景图,具体方法首先用hbuilder新建一个html文件,创建一个div,并给div一个class属性,在上方的style中设置class的样式,这里把div的宽度和高度设置大点,方便观察效果:

2、然后使用background设置属性;background是一个复合属性,有五个参数,第一个是背景颜色,第二个是图片,第三个是图片重复的设置,第四个是背景图像是否固定或者随着页面的其余部分滚动,第五个个背景图像的起始位置:

3、最后打开浏览器,就能看到图片了,图片覆盖不了的部分则是使用背景色填充:

css给标签设置背景图片是通过background属性实现的。当然用background-image更正式一些。

不管用上述那种方式书写值都是一样的,url("./image.png")。

括号里面的分号包裹的就是图片的路径。

当然,设置背景图的标签要有宽和高,不然背景图显示不出来。