您现在的位置:首页 >> 前端 >> 内容

css背景图设置教程、css背景图属性

时间:2017/11/14 14:59:22 点击:

  核心提示:.bgImg1{width: 200px;height: 500px;border: 1px solid #999;background-image: url(img/pangxie.png); 添加...

.bgImg1{width: 200px;

height: 500px;

border: 1px solid #999;

background-image: url(img/pangxie.png); 添加背景图

background-repeat: no-repeat; 设置背景图的填充

background-position: 500px 100px; 背景图的位置

}

.bgImg2{width: 200px;height: 200px;

background: url(img/pangxie.png) no-repeat 50px 100px #009;

/50px 100px #009;插入的图片位置,颜色 /

css背景图属性

a、背景颜色

background:color值;

b、背景图片的设置

background-image:url(背景图片的路径及全称);

1)容器尺寸等于图片尺寸,背景图片正好显示在容器中;

2)容器尺寸大于图片尺寸,背景图片将默认平铺,直至铺满元素;

3)容器尺寸小于图片尺寸,只显示元素范围以内的背景图。

4)加载背景图必须有容器区域;

c、背景图片平铺属性

语法:选择符 {background-repeat:no-repeat }

no-repeat:不平铺

repeat:平铺 (默认)

repeat-x:横向平铺

d、背景图片的位置

{background-position:水平方向属性值 垂直方向属性性;}

水平方向值:left/center/right或数值

垂直方向值: top/center/bottom或数值

e、各属性的缩写

{background:属性值1 属性值2 属性值3;}

背景缩写: {background:#00ff00 url(背景图片的路径及全称) no-repeat center top;}

Tags:CS SS S背 背景 
作者:网络 来源:我的博客