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 }