背景图的设置

简介: 背景图的设置

1、背景颜色

background-color:

background-color: pink;

 

背景图片的显示原则

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

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

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

 

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

 

border: 1px solid red;

background-image: url(../images/tu.png);

 

background-repeat:

                  repeat(平铺) | no-repeat(不平铺) | repeat-x(水平方向平铺,垂直方向不平铺) |

                  repeat-y(垂直方向平铺,水平方向不平铺);

 

background-repeat: repeat-y;

 

背景图的固定

background-attachment:scroll(滚动) | fixed(固定)

background-attachment:scroll;

 

 

背景定位

background-position: 水平方向的值(left|center|right|数值+单位|百分比) 垂直方向的值(top|center|bottom|数值+单位|百分比);

水平向右 垂直向下移动 是正数值

水平向左 垂直向上移动 是负数值

简写:

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


相关文章
|
2月前
设置表格的背景颜色和背景图片
设置表格的背景颜色和背景图片
27 10
|
2月前
|
区块链 Python
9-18|图片上生成字体设置字体大小
9-18|图片上生成字体设置字体大小
|
2月前
设置背景图像平铺和位置
设置背景图像平铺和位置。
33 5
|
5月前
|
前端开发
网页如何设置背景图片
网页如何设置背景图片
|
5月前
设置单元格的背景颜色和背景图片
【6月更文挑战第17天】设置单元格的背景颜色和背景图片。
24 3
|
6月前
背景图像
【5月更文挑战第3天】背景图像 。
88 9
|
6月前
背景图像
背景图像。
170 3
|
6月前
|
前端开发
放置背景图像
放置背景图像。
26 0
|
前端开发
echarts如何设置背景图的颜色
echarts如何设置背景图的颜色
284 0
CSS3文本居中显示、圆形圆角绘制、立体阴影效果设置实例演示
CSS3文本居中显示、圆形圆角绘制、立体阴影效果设置实例演示
132 0