0

我最近开发了一个网站，它在 1024 分辨率下看起来不错，但在更大的分辨率上就搞砸了。以下是您可能需要查看的文件的链接：网站的CSS 、菜单栏的 CSS。这是一个 PHP 文件，但我已经链接到包含的 HTML 文件。

我有一个常规的 17' 屏幕，而客户端有一个宽屏。她在右侧看到了我没有看到的空白区域。我只是在使用 viewlike.us 网站测试不同分辨率时才看到它。我怎样才能使它调整比例？谢谢。

4

2 回答 2

0

这是因为您将 body 设置为 1024 px

body {
width:1024px;
background-image:url(images/top_background.jpg);
background-repeat:no-repeat;
background-color:#FFF;
}

你不想这样做，你通常做的是有一个页面包装器，你将大小设置为 1024px。

例如，您可以在 html 中使用它

<html>
   <head>...</head>
   <body>
      <div id="pageWrapper">
        <!-- all your content here -->
      </div>
   </body>
</html>

然后在css中你可以有这样的东西：

#pageWrapper {
    width:1024px;
    margin: 0 auto;
}
于 2013-04-04T19:37:51.457 回答
0

你通常有这样的结构：

<html>
   <head>...</head>
   <body>
      <div id="header-wrapper>
         <div id="header>
            <!-- header content here -->
         </div>
      </div>
      <div id="pageWrapper">
        <!-- all your content here -->
      </div>
   </body>
</html>

然后，您可以为标题设置一个图像，为正文设置另一个图像，或者为标题设置一个图像，为正文设置一个背景颜色。这完全取决于你在做什么。

背景图像通常不是那么大。您通常拥有的是可以在 X 或 Y 或两者上重复的图像或图案。在 css 上你可以有类似的东西：

#headerWrapper {
    width:100%;
    height: 100px;
    background: url("/img/background.png") repeat-x;
}

这样，图像将在标题上水平重复。然后你可以为 body 设置另一个背景，或者只是一个背景颜色。

同样，这在很大程度上取决于您要达到的目标。

祝你好运！！

于 2013-04-05T13:23:36.643 回答