小知识点

• px，rem前面加空格，不生效。所以他们前面不能加空格。
• box-shadow，用的出神入化；

如何找素材

著名的设计网站

Dribbble、站酷、花瓣网

大屏适配公式

• 设计稿一般是16:9；
• 如果大屏很宽，我们就上下占满。左右居中；
• 如果大屏很窄，我们就左右占满，上下居中；

算法：

• Wp为页面有效宽度，Hp为页面有效高度；
• 页面左右居中，上下居中，左右留白即可；
• 然后再head里面设置1rem = Wp / 100
• 当大屏很宽时，W设备/H设备 > 16/9;
  • 那么设备的高度占满是确定的H设备是确定的；所以页面应该的宽度：
    • Wp=H设备*16/9
• 当大屏很窄时，，W设备/H设备 < 16/9;
  • 屏幕的宽度被占满，此时页面的宽度就是屏幕的宽度
    • Wp=W设备
• 有效宽度Wp和有效高度Hp的比是16:9；