body的背景
程序员文章站
2022-05-22 20:11:15
body的背景 背景background-color:默认border-box 画布canvas 一块区域 背景background-color的画布的特点:(画布大于等于视口) 最小宽度视口宽度 最小高度视口高度 html元素的背景: 覆盖画布 body元素的背景颜色(推荐) 如果html元素有背 ......
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 }
上一篇: 燃烧我的卡路里!荣耀V30 PRO手机智能识物可以这样玩
下一篇: 怎么回事