首先我们观察一下这张背景图,如果你是一名合格的前端工程师 你回怎么优化呢?
- 初级前端:当然是拖入 tinypng或者ImageOptin 啦,如果你连这两个都不知道,换份工作啦。
- 高级
亿一点的前端:麻烦给我这两者图我并排放 搞基高级工程师:麻烦切我两张这样的图,水顺便给我说下背景颜色(扶眼镜)
width 100vw
height 100vh
background url('1.png') repeat, url('2.png') top 10vw left 10vw repeat #FAF2F4
background-size 20vw 20vw
利用好background的repeat和定位属性就可以解决这种类桌布类型的背景图的优化问题了