所有屏幕的屏幕分辨率 [英] Screen Resolution for all screens

问题描述

我有一个带有文本框，验证和其他控件的Web表单。无论分辨率如何，我如何让网页保持其大小？现在我使用表来保持一切对齐。有没有更好的办法？谢谢。

I have a web form with textboxes, validations and other controls. How can I get the web page to keep its size no matter what resolution it is? Right now I use tables to keep everything aligned. Is there a better way? Thanks.

推荐答案

你不能也不应该。网页的渲染实际上不是通过屏幕分辨率定义的（这是错误的术语，你可能只是屏幕的大小，以像素为单位;分辨率是完全不同的，以线/毫米或线/英寸，点测量/ mm，点/英寸，解析某些绝对尺寸细节的能力）。如果取决于浏览器窗口的大小，可以由用户随时更改。



您应该更好地接受 liquid 的概念，流体和弹性设计。请看我过去的答案：

网页屏幕分辨率（Cross Browser \ Cross Platform）问题 [ ^ ]，

获取屏幕分辨率 [ ^ ]。

-SA

You cannot and should not. The rendering of the Web page is really defined not by screen "resolution" (which is wrong term, you probably meant just the size of the screen in pixels; resolution is something totally different, measured in lines/mm or lines/inch, dots/mm, dots/inch, the ability to "resolve" detail of certain absolute size). If depends on the size of the browser window, which can be changed by the user anytime.

You should better embrace the concept of liquid, fluid and elastic design. Please see my past answers:
Webpage screen resolution (Cross Browser\Cross Platform) problem[^],
To Get Screen resolution[^].

—SA

除了@SA有什么提到，我会说了解 弹性框 。当你掌握响应式设计实践的细节时，接下来学习弹性框，它将在所有主流浏览器中得到支持。



现在这里是统计数据：< a href =http://caniuse.com/flexbox>我可以使用：Flex Box [ ^ ]

它已经拥有68.36％的支持和14.29％的浏览器部分支持，并且通过包含后备技术，你也可以在生产环境中使用它。最好的部分是，一旦你掌握了它，你将不再强调你的网页的宽度和高度。



这是一个可以帮助你的详细版本： A-guide-to-flexbox [ ^ ]





我想指出的另一件事是，WDesigners目前正在推动从流体/液体设计的方式，而不是采用 Show-What-Necessary 方法。例如，流体设计涉及将桌面网站的所有元素安排到小屏幕设备，但对于后一种方法，它包括隐藏不必要的元素并仅显示那些必要的元素。设计师可以选择在较小的屏幕上显示特定元素并将其隐藏在较大的屏幕上，反之亦然。最后，你最终会得到2-3个断点+流体设计方法，以及显示必要元素的用户体验。

Apart from what @SA has mentioned , I would say learn about flex box. By the time you would grasp the details of responsive design practices , learn flex box next and it would be supported in all major browsers.

For now here are stats : Can I use : Flex Box[^]
It already has 68.36% support and 14.29% partial support for browsers and by including fallback techniques , you can use it in production environments too.And the best part is , once you've mastered it , you'll no longer stressing about widths and heights of your webpages.

Here's a detailed version that would help you : A-guide-to-flexbox[^]


Another thing I would like to point out is , WDesigners currently is moving away from fluidic/liquid design and instead adopting the Show-What's-Necessary approach. For example , fluidic design deals with arranging all elements of a desktop website to a small screen device , but for latter approach , it includes hiding unnecessary elements and showing only those which are necessary. Designers can choose to show specific elements on smaller screen and hide them on bigger ones and vice-versa. At the end , you'll end up with 2-3 breakpoints + fluidic design approach in b/w them + an UX consideration of showing necessary elements.

这篇关于所有屏幕的屏幕分辨率的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！