给整体页面加背景色:background-color:blue
背景图与背景色都设置,优先显示背景图
用图片当做背景:
1.默认完全铺满:background-image:url(small.jpg)
2.水平方向铺满:background-repeat:repeat-x;
3.数值方向显示:background-repeat:repeat-y;
4.只显示一次:background-repeat:no-repeat;
5.定义背景图片随滚动轴的移动方式:background-attachment:
取值: scroll | fixed | inherit
scroll: 随着页面的滚动轴背景图片将移动
fixed: 随着页面的滚动轴背景图片不会移动
inherit: 继承
精确控制图片位置
background-position:水平,竖直;
background-position:center top;
background-position:right center ;
background-position:50px 50px;(像素精确控制)
计算机屏幕,左上角为原点, 往右为x正,往下为y正
利用div的盒子加上background-position,精准显示图片的某个位置
可以理解为背景图为一块幕布,div为一个小窗口
快速写入背景色与背景图
background: gray url(bg.png) no-repeat
先背景色,再背景图,再repeat,再attachment