设计responsive页面时的注意点:
- 使用media query增加breakpoint来实现responsive.
- 永远以mobile设计优先。
- 设计组件时经常长宽使用百分比。
- 如果需要设置一些长宽固定数值时,使用em作为单位是个不错的选择。然后针对字体大小设置对应的em大小。以字体作为参照物。
参考文档:
- https://developer.mozilla.org/zh-CN/docs/Web/Guide/CSS/Media_queries
- https://www.w3.org/TR/css3-mediaqueries/