关于viewport设置求教
需求是这样的
一个html页面,要求不论屏幕竖着还是横着画面的整体内容特别是文字随之放大缩小
排版不变
例子如下图
如例子中一样是整体页面填充变大而不能留余白
我做好了一个html页面
虽然完成了针对不同屏幕大小的手机页面整体按照比例显示
可是内部文字却不随之变化
网上查了很多资料都说文字的大小需要通过js来设定
但是领导说只需要设置viewport就可以完成文字大小自动变换了
查阅很多资料依然无解
请求各位大神帮忙
拜谢!
[解决办法]
你要的是这个效果??
<html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><title>测试</title></head><body><Script language="javascript">//获取屏幕宽度var w = (window.innerWidth)?window.innerWidth:(document.documentElement && document.documentElement.clientWidth) ? document.documentElement.clientWidth:document.body.offsetWidth;var baseWidth = 320; //设置基本宽度var baseSize = 14; //设置基本字体var fontsize = Math.round(w/baseWidth * baseSize);document.write ("<style type=\"text/css\">td{font-size:" + fontsize + "px;}</style>");</Script><table border="0" width="96%" cellspacing="0" cellpadding="0"> <tr> <td>你的文字放这里</td> </tr></table></body></html>