响应式页面,文字如何做到如图片般自适应缩放?


最近在做个新案例,客户要求做wap而且要是现在最流行的自适应页面。小弟第一次学习这方面的技术,求教各位大神如何让字体的大小也能够随着屏幕大小自动缩放?我用的是默认的100%的16px大小。提供个网址给大牛们参考小。

1.casual.sinaapp.com

由于暂时考虑的是移动端所以没有针对pc端做设计。请自由控制浏览器的尺寸查看效果。

问题:
1、字体大小如何实现自动缩放?
2、当浏览器高度小于100px时部分图片跑出所属的div。该图片使用的是padding-top控制居中。

3 个解决方案

#1


其他部分文字可以使用em或rem来作为单位。
然后根据几个断点来改变body的文字大小。就能按比例改变内容部分的文字了。而且只要改一个body就好了。维护方便。

#2


可以参考jquery mobile

#3


引用 2 楼 MengYouXuanLv 的回复:
可以参考jquery mobile

谢谢!已经用jquery mobile解决!

注意!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系我们删除。



 
© 2014-2019 ITdaan.com 粤ICP备14056181号