1》单独制作移动端页面---主流
一个项目开发两套页面(pc端一套、移动端一套)
注意点:
1)浏览器兼容性问题(只考虑webkit内核,放心大胆使用h5和c3)
2)样式初始化,使用别人写好的。
3)移动端元素,使用c3的新的盒子模型进行布局(padding和border不会撑开盒子)
4)手机浏览器中会有一些默认的样式,清除。
布局方式:
1)流式布局(百分比布局)
① 布局盒子的宽度通通设置为百分比
② 布局盒子会设置一个最大值 max-width和一个最小值 min-width
2)flex布局(弹性盒布局)
3)rem布局
4)响应式布局
2》做响应式页面(兼容pc和移动端)
一个项目开发一套页面(根据屏幕大小进行自动适配显示)
缺点:工作量比较大,兼容性不好调,开发和维护成本高。理想效果不太好实现。 12年之前流行。 |
|