草丁图书馆

  1. 首页 > 生活杂烩 >

如何让网页自适应屏幕，怎么让网页自适应屏幕大小( 三 )

小知识



三、 兵分两路
如果你的网页不经常更新 ， 而且对页面效果极其在意 ， 那好 ， 你就设计两个页面 ， 分别对应800×600和1024×768两种分辨率 。 然后根据不同的分辨率进行跳转就行了 。
例如：
<script LANGUAGE="JavaScript">
function redirectPage() {
var url_else = "";
var url_800x600 = "";
var url_1024x768 = "";
var url_1366x768 = "";
if ((screen.width == 800) && (screen.height == 600))
window.location.href= http://www.ncwxdh.com/p/url_800x600;
else if ((screen.width == 1024) && (screen.height == 768))
window.location.href= http://www.ncwxdh.com/p/url_1024x768;
else if ((screen.width == 1366) && (screen.height == 768))
window.location.href= http://www.ncwxdh.com/p/url_1366x768;
else
window.location.href= http://www.ncwxdh.com/p/url_else;
}
</script>
如何让网页在浏览器自适应屏幕大小 网页页面大小的调整方法：

方法1：

打开所需要缩放的网页后 ， 点击键盘上的“Ctrl”后不放再点击“+”就可以放大网页 。 若想要缩小网页则点击“Ctrl”后不放再点击“-”即可缩小网页 。

方法2：

打开所需要缩放的网页 ， 点击网页的空白处后 ， 点击键盘上的“Ctrl”不放 ， 再滑动鼠标滚轮 ， 向上滑时可以放大网页 ， 向下滑时可以缩小

方法3：

1 ， 打开所需要缩放的网页 ， 在浏览器的顶端点击“查看”即查看菜单 。

2 ， 点击后在下拉的菜单栏中找到并选择网页缩放 ， 即可选择想要缩放的比例 。

3 ， 选择后即可放大或缩小网页页面 。

方法4：

1 ， 打开所需要缩放的网页 ， 在浏览器底端找到“浏览器缩放功能”并点击 。

2 ， 点击后出现可以调整的比例条 ， 选择想要放大或者缩小的比例即可 。

3 ， 选择后即可放大或缩小网页页面 。

以上就是网页页面大小怎么调
如何调整网页大小与屏幕适应？ 方法：
1、在网页头部加上这样一条meta标签：<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=0.5, maximum-scale=2.0, user-scalable=yes" />

解释：
width=device-width ：宽度等于设备屏幕的宽度
initial-scale=1.0：表示：初始的缩放比例
minimum-scale=0.5：表示：最小的缩放比例
maximum-scale=2.0：表示：最大的缩放比例
user-scalable=yes：表示：用户是否可以调整缩放比例
另外：如果想控制字体的大小的话 ， 应该使用相对大小 ， 可以用下面这段代码 ， 一般不用也可 ， 这里只是说明一种方法 。
相对大小的字体
字体也不能使用绝对大小px ， 而只能使用相对大小em 。
body {font: normal 100% Helvetica, Arial, sans-serif;}
上面的代码指定 ， 字体大小是页面默认大小的100% ， 即16像素 。
h1 {font-size: 1.5em; }
然后 ， h1的大小是默认大小的1.5倍 ， 即24像素（24/16=1.5） 。
small {font-size: 0.875em;}
small元素的大小是默认大小的0.875倍 ， 即14像素（14/16=0.875） 。

2、让网页适应不同的浏览器
浏览器的格局现在是两分天下 ， 一分是IE ， 另一分是NetScape ， 在国内Ie有绝对的占有率 ， 在这种情况下我们设计的网页只要兼容它就行了 ， 但NetScape在国外还是有很多人使用 ， 毕竟它是浏览器的元老 。
虽然没有办法做出让所有浏览器都兼容的网站 ， 但只要注意以下几点 ， 做出来的网页在各个浏览器都中能达到比较好的显示效果：

推荐阅读


上一篇：上火体质如何调理，容易上火的人吃什么调理

下一篇：如何增厚脸部角质层，脸上有死皮角质层增厚