如何调整页面大小？

即时通讯设计一个网站，我有屏幕分辨率问题。我想扩展我的页面，但我不能这样做。如何调整页面大小？

其自己的网站和21.5 INC MAC画面：（其完成的，没有问题） enter image description here

它我的笔记本电脑屏幕1366×768像素的分辨率; enter image description here

我tryed这对CSS;

body, html {height:100%;}

and this on html;

<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1, maximum-scale=1"> 
    <link rel="stylesheet" href="css/style.css" type="text/css" media="all" />

文档类型为：XHTML 1.0过渡

，但不工作。我该怎么做？

谢谢！

来源

2012-11-04 Ryliatron

你想如何“缩放”页面？您是否想要缩小笔记本电脑屏幕上的版本，以便整个页面始终可见？ –

重复您自己的问题：[我如何扩展我的网站？]（http://stackoverflow.com/questions/13219912/how-can-i-scale-my-website） – Quentin

是的，我想缩小到网站为我的笔记本电脑屏幕，但它只需要工作在小屏幕上。 – Ryliatron

基本上，你不能以简单，简单的方式。

视口标签和所有仅适用于移动设备（目前），因为它们加载整个页面和泛周围，以不同的方式，以桌面浏览器。

大多数网站设计为垂直滚动，所以CSS迎合真的很好的横向拉伸，但非常非常糟糕的垂直做同样的事情。你能做到这一点

的一种方式，是设计各种不同的版本，然后使用媒体查询来更改属性不同的高度。

在你的CSS，这看起来像：

#box { 
    width:100px; 
    height:100px; 
    background-color:red; 
} 

@media all and (max-height: 400px) and (min-height: 200px) { 
    #box { 
     background-color:green; 
    } 
}

这将使一个盒子是红色的，除非屏幕是200像素和400像素高之间。当屏幕尺寸不同时，您可以使用该技术来执行不同的操作。这些日子已得到很好的支持。（http://caniuse.com/#feat=css-mediaqueries-基本上无处不在，但IE8和下）。

另一种方法是使用视口单元（vh而不是px或em），其中1vh =浏览器高度的1％。这是超级不好支持现在（http://caniuse.com/#feat=viewport-units-没有Firefox，没有歌剧，IE9和以上）。

除此之外，您正在使用javascript来调整圆形菜单的高度，以便缩放。如果你还没有意识到JS的话，jQuery是需要关注的。

总之，虽然，让事情变得简单：

设计的网站，垂直滚动
设计网站，可以不小心滚动，并为600px的定义不同的行为，768px，720px，将1080px高位挡拆（记得在这里减去浏览器铬的高度，我猜你可以估计为100-300px之间的某个地方）

来源

2012-11-04 17:00:39

谢谢，现在我试图重拍我的CSS。 – Ryliatron

-1

你是否尝试过元标记视口？

<meta name="viewport" content="width=320">

来源

2012-11-04 16:46:20

没有工作。：/ – Ryliatron

您正在设置html和body的高度为100％，但高度和宽度如何的元素ins ide身体？为了使它们更加流畅，适合所有屏幕尺寸，您必须给出高度和宽度以及几乎每个元素的填充和边距百分比。

来源

2012-11-04 17:18:58

如何调整页面大小？

回答

相关问题