背景图片

给整体页面加背景色: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

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容