1

我正在做一个网站的前端设计，需要一些关于元素大小的帮助。网页布局/元素大小在我的 19 英寸、1440x900 分辨率显示器上看起来很棒，但是当我在更大的高清显示器上查看同一页面时，所有内容都很小。我应该使用某些 CSS 度量单位吗？无论显示器的尺寸/分辨率如何，页面看起来都一样？我是前端设计的新手，所以在标准实践方面我不确定。

提前致谢，

4

4 回答 4

0

我认为这个网站是一个很好的起点。他们解释了您可以在 css 中使用哪些单位以及在哪里使用其中的哪些单位。

例如，如果您在页面上编写文本，建议使用em作为单位，因为它会自动适应用户设备的标准字体大小。例如，2em 表示当前字体大小的 2 倍。

正如其他一些答案所指出的那样，查看 css 属性max-width和max-height. 在某些时候 - 当分辨率足够高时，您的网站将覆盖整个网站，并且文本不再易于阅读。因此，设置其中一些属性来限制网站的最大宽度可能是个好主意。

好吧，您可能要考虑的第三件事是使用预定义的 css 框架，如bootstrap，它可以帮助您轻松且更重要的是非常快速地设计一个漂亮的网站。这当然不会在所有情况下都起作用（例如，当您需要适应公司设计或其他东西时），但在大多数情况下（例如，如果您只想要一个易于使用的网络界面），引导程序值得考虑。

但是，您还询问是否有任何“标准”做法。我会说有一些建议和“经常使用”的做法，但这也取决于你喜欢哪种方式以及你的网站有哪些具体要求。

我希望这个答案对您有所帮助，并为您提供了一个起点。

于 2013-10-21T16:24:35.063 回答
0

您始终可以使用媒体样式查询系统将您的网站设计为特定的像素比率。我将向您展示一些我在手持媒体查询中经常使用的小示例。

iPad 肖像：

@media only screen and (min-width: 768px) and (max-width: 980px ) {
    // This media query would be appropriate for iPad portrait queries.
}

iPhone、iPod Touch、Android 设备（相同尺寸）：

@media only screen and ( max-width: 767 px) {
    // This media query would be appropriate for iPhone, iPod Touch, and Android.
}

您当然可以将其用于大型监视器查询，因为主要 css 并不是一刀切的交易。我希望这在某种程度上有所帮助，我会不断检查我的答案，所以如果您发表评论，我会更新我的答案。

于 2013-10-21T16:12:44.257 回答
0

我建议您使用一个框架来处理您的所有前端，包括可扩展性，并且有一个特定的称为引导程序http://www.getbootstrap.com/2.3.2/index.html

在那里，您将获得创建现代用户界面所需的所有信息以及您想要的内容

于 2013-10-21T16:13:26.820 回答
0

您可以使用 % 使所有内容都相对，但这是不好的做法，并且违背了具有不同分辨率的整个目的。

研究响应式设计。

于 2013-10-21T16:13:41.877 回答