我的网站在1024以上的分辨率下无法正常显示

我最近开发的网站在1024分辨率下看起来不错，但在较大的分辨率下会出现混乱。以下是您可能需要查看的文件的链接：CSS for the site，CSS for the menu bar。这是一个PHP文件，但我已经链接到包含的HTML文件。我的网站在1024以上的分辨率下无法正常显示

我有一个普通的17'屏幕，而客户端有一个宽屏。她看到右侧的白色空间，我不知道。我只看到它，因为我已经使用网站viewlike.us来测试不同的分辨率。我怎样才能使它调整比例？谢谢。

来源

2013-04-04 MTech

没有指向HTML或网页的链接 – 2013-04-04 19:24:17

抱歉。它最初被包括在内，我认为但是我超过了我的最大连接数。该网站是inecnursing.org。自原始帖子以来，我做了一些更改。我想我必须制作一个更大的背景图像，以扩展更高的分辨率。它们正在排队，但它们并没有正确地分布在整个页面上，只是页面的一部分被使用。 – MTech 2013-04-04 22:16:55

这是因为你定身是1024像素

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

你不想这样做，你平时做的是有你设置大小为1,024像素的网页包装。

例如，您可以在HTML中有这样的

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

然后在CSS，你可以有这样的事情：

#pageWrapper { 
    width:1024px; 
    margin: 0 auto; 
}

来源

2013-04-04 19:37:51

感谢您的快速回复。我会在一秒钟之内尝试一下。我只是想首先补充一点，我将身体初始设置为100％，但是在分辨率超过1024像素时出现失真，所以我将其设置为背景图像的长度1024。作为一个额外的快速问题，因为我对创建响应式设计相当陌生，因此遇到了一些问题。当你有像我这样的背景图片，它构成了网站的标题时，它的尺寸应该是什么样的，它适用于任何分辨率？我应该制作一张巨大的照片，以便相应缩小？ – MTech 2013-04-04 19:55:30

通常你有一个这样的结构：

<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; 
}

用这个图像将在头上水平重复。然后你可以为身体设置另一个背景，或者只是一个背景颜色。

同样，它取决于你想要达到的目标。

祝你好运！

来源

2013-04-05 13:23:36

谢谢你！我认为这是我需要的最终解决方案。 – MTech 2013-04-06 13:52:26

我的网站在1024以上的分辨率下无法正常显示

回答

相关问题