【发布时间】:2011-03-24 08:18:39
【问题描述】:
我的开发机器有一个相当大的屏幕(19 英寸)。我的一些客户的屏幕尺寸较小(或者他们可能选择不最大化我的网页),因此页面上的控件到处都是并且相互重叠。知道如何解决这个问题吗?
【问题讨论】:
标签: c# asp.net .net-3.5 screen
我的开发机器有一个相当大的屏幕(19 英寸)。我的一些客户的屏幕尺寸较小(或者他们可能选择不最大化我的网页),因此页面上的控件到处都是并且相互重叠。知道如何解决这个问题吗?
【问题讨论】:
标签: c# asp.net .net-3.5 screen
安装 webdeveloper 工具栏并测试其他屏幕尺寸。
查看css floats,让您的布局更加动态。或者固定宽度,这样它们就不能调整大小了。
这听起来更像是布局/css 问题,而不是 .net/c# 问题。
【讨论】:
为您的身体使用固定宽度。在你的 CSS 中做这样的事情:
body { width: 800px; margin: 0 auto; }
这应该将 body 固定为 800px 宽度并在页面上居中。找出您的客户使用的最低分辨率是多少,然后将滚动条和一点边距削减 50 左右像素,然后将其用于您的宽度。
我个人不会尝试在此之上适应非最大化的场景,因为你不会留下很多房地产。
【讨论】:
我的第一条建议是不要等待以不同的分辨率尝试您的页面。这应该是您开发过程的一部分。如果您知道您的用户将拥有比您更小的浏览器窗口,请设身处地为他们着想,用一个小窗口进行大量测试。就像在其他浏览器中测试一样;不要假设在 IE6 中一切都看起来和工作正常。
此问题并非特定于 ASP.NET。您的控件只是标记和样式,因此最终您需要将它们协同工作,这样页面在缩小时不会明显“损坏”。
选择您想要支持的最小屏幕分辨率,并绘制一个草图,展示事物如何适应可用空间。如果您还不是很熟悉 CSS,固定宽度可以大大简化事情。
【讨论】:
我发现过去来自 google 的 browser size tool 很有用。您可能希望将页面的正文设置为您认为用户群的最低通用固定宽度。浏览器大小工具将帮助您充分利用该空间。
【讨论】:
我已经使用了其他答案中描述的所有技术:尝试适应用户浏览器大小的完全流动宽度和无论如何保持不变的固定宽度。
我最近使用的一个非常成功的解决方案是将两者结合起来。使用 CSS 和 Javascript,我指定了页面的最大宽度和最小宽度。这样一来,页面就可以针对那些运行更高分辨率的用户进行一些扩展,同时允许我通过确保事情不会太挤在一起来维持较低分辨率的一些秩序。
关键是要了解您的典型受众。通过分析,我们知道超过 50% 的用户正在使用 800 x 600 到 1024 x 768 之间的分辨率,因此我们尝试针对这些分辨率。混合流体布局使我们能够创建适合这些分辨率的页面,同时在一定程度上扩展以减少更大屏幕(更高分辨率)上的空白空间。
【讨论】: