HTML怎样将网页设计主动顺应屏幕宽度
同意网页宽度主动调整
“自顺应网页设计”到底是如何做到的?其实并不难。
第一,在网页代码的头部,参加一行viewport元标签。
<meta name=”viewport” content=”width=device-width, initial-scale=1″ />
viewport是网页默许的宽度和高度,上面这行代码的意思是,网页宽度默许等于屏幕宽度(width=device-width),原始缩放比例(initial-scale=1)为1.0,即网页初始大小占屏幕面积的100%。
所有主流阅读器都支撑这个设定,包罗IE9。关于那些老式阅读器(主如果IE6、7、8),需要使用css3-mediaqueries.js。
<!–[if lt IE 9]><script src=”http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js”></script><![endif]–>
不使用绝对宽度
由于网页会按照屏幕宽度调整规划,所以不克不及使用绝对宽度的规划,也不克不及使器具有绝对宽度的元素。这一条非常重要。
详细说,CSS代码不克不及指定像素宽度:width:xxx px;
只能指定百分比宽度:width: xx%;
或者width:auto;
相关引荐:
网页自顺应屏幕宽度
HTML5响应式(自顺应)网页设计
自顺应屏幕大小的网页是如何做出来的
以上就是HTML怎样将网页设计主动顺应屏幕宽度的具体内容,更多请关注百分百源码网其它相关文章!