body的背景

body的背景

背景background-color：默认border-box

画布canvas

一块区域

背景background-color的画布的特点：（画布大于等于视口）

最小宽度视口宽度

最小高度视口高度

 

 

html元素的背景：

覆盖画布 body元素的背景颜色（推荐）

如果html元素有背景颜色，body背景颜色正常覆盖边框盒，否则，body背景颜色覆盖画布 画布设置背景图片（总结就相对html元素）

背景图宽度的百分比是相对于视口window.innerwidth

背景图的高度百分比相对于html元素的height（网页高度）

背景图的横向位置百分比，预设值，相对视口

背景图的纵向位置百分比，预设值，相对html的height(网页高度)

 

例子： html{ padding:10px; } body { width:1200px; border: 4px dashed red; background: url('../img/201801.png') no-repeat; background-size:50% 50%;//背景图width=视口宽度*50%；背景图高度height=html高度*50%； background-position:right 10px bottom 10px;//相对视口右边10px,相对html下边缘10px }