css background 背景

为了丰富网页的显示效果，可以通过css background-image 属性可以设置元素的背景图片。

语法

background-image：none |  url（url）

参数

参数解释如下

参数作用
none无背景图（默认的）
url使用绝对或相对地址指定背景图像

路径问题

关于background-image属性url的图片路径问题，有两种写法。

1. 绝对路径

可以写web服务的路径，比如某个图片是通过url可以访问的路径

www.yxjc123.com/static/default/yxjc/css/good-morning.jpg

那么就可以直接写成  background: url(/static/default/yxjc/css/good-morning.jpg)  即可。

2. 相对路径

对于样式css文件和图片文件在同文件夹下，可以直接写background: url(good-morning.jpg)  ，

如果不是就需要看图片的路径在哪里了。对于css文件所在目录来说：
“../”表示上一级目录开始 
“./”表示当前同级目录开始 
“/”表示根目录开始。
“../../  ”表示源文件所在目录的上上级目录

例子

<!DOCTYPE html>
<html>
<title>css background-image属性例子</title>
<head>
<style>
div
{
   color:#fff;
   width:300px;
   height:200px;
   background-image: url(/static/default/yxjc/css/good-morning.jpg) ;
}
</style>
</head>
<body>
<div>
	css background-image
</div>
</body>
</html>
输出：

css background-image 设置背景图

上面的例子中，图片默认是平铺了的。