我应该对 UI 控件使用 CSS 单位 pt 吗？
我正在开发一些 UI 控件，想知道是否应该使用 pt 来表示宽度、高度、边框大小、边距、填充和字体大小？我希望控件可扩展，并且在每个屏幕和投影仪上看起来都相同。
在设计可扩展的用户界面时，我还应该担心什么吗？我已经在使用非基于光栅的图形（颜色和 SVG）。
I am working on some UI controls and wondering if I should use pt for the widths, heights, border sizes, margins, paddings, and font sizes? I want the controls to be scalable and look the same on every screen and projector.
Is there something else I should worry about when designing for scalable user interfaces? I am already using non-raster based graphics (colors and SVG).
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（4）
不。
pt的大小是固定的。如果您想要可扩展性，您应该使用em's 和/或ex's（也许是%'s）。No.
pt's are fixed size. You should be usingem's and/orex's (maybe%'s) if you want scalability.如果您想要可缩放，那么您不需要
pt，它解析为 1/72 英寸（但前提是计算机已正确校准以知道要使用的 DPI）。如果对于您坐在正前方的屏幕来说，某些内容在 72 点（1 英寸）处是合理的，那么当投影（仍然是 1 英寸高）到 10 英尺外的屏幕上时，它就不再合理了。
If you want scalable, then you don't want
pt, which resolve to 1/72th of an inch (but only if the computer is correctly calibrated to know what DPI to use).If something is sensible at 72pt (1 inch) for a screen that you sit right in front of, then it isn't going to be sensible when projected (still 1 inch tall) on a screen 10 feet away.
是的，您可以使用 pt 或 em。 12 点 = 1em。这是当您在浏览器中选择较小或较大字体时调整的大小。用 pt 或 em 标记的元素的大小与字体一起调整（我认为）。
然而，现代浏览器（甚至是最新的 FireFox 和 IE）更喜欢缩放整个页面而不是仅缩放字体，尽管它仍然是仅缩放字体的选项。在这种情况下，选择 px 还是 pt 并不重要。
Yes, you can use pt or em. 12pt = 1em. This is the size that is adjusted when you choose a smaller or bigger font in your browser. Elements marked up with pt or em are sized along with the font (I think).
Modern browsers however (even the latest FireFox and IE), prefer to zoom the entire page instead of only the font, although it's still an option to zoom fonts only. In that case, it doesn't matter much whether you choose px or pt.
如前所述，1 磅等于 1/72 英寸。我使用的屏幕高度为 20 厘米，像素为 1200。如果我投影它，这 1200 个像素会扩展到 3 米。
w3c CSS 规范中有很多度量标准，很多都被使用，但很少被正确使用。
最好的选择是使用 em 进行布局，这与所使用的字体相关。也可以使用百分比。
然而，您需要通过“小蝌蚪”来“推动”一些浏览器布局，特别是在查看按钮、下拉菜单和文本框时。通常这些是设置某些东西的相对位置，以将其向上/向左/向下/等等。典型的例子是 IE 和 Firefox 之间存在细微差别。
让您的表单“在所有屏幕和投影仪上呈现相同的效果”是相当雄心勃勃的，这意味着不同的浏览器看起来都一样。
As has been mentioned, 1 point is 1/72 of an inch. The screen I'm using has 1200 pixels on a height of 20cm. If I project it, those 1200 pixels spread to 3 metres.
There are many measurements in the w3c CSS specification, many are used but few properly.
Your best bet is to use em's for layout which is related to the font in use. Percentages can also be used.
However, you'll need to 'nudge' some browser layouts by "a gnat's tadger", particularly when looking at buttons, dropdowns and text boxes. Often these are setting something to position relative to nudge it up/left/down/whatever. Typical examples are when IE and Firefox have slight differences.
It's quite ambitious to have your forms rendering "the same on all screens and projectors", implying different browsers all look the same.