液体布局：如何
如果我用百分比标记所有的 div，它们会很好地填充所有空间。我面临 2 个问题：
a) 图像大小：如何定义图像大小，以便它们在窗口大小调整时不会变得比想要的更大或更小
b) 字体大小：如何根据分辨率增大或减小字体大小- 到底应该这样做吗？ （我面临的问题是文本在非常高的分辨率下变得难以辨认）
请为我指出有关如何制作液体布局的良好参考。
If I mark all my divs in percent, they fill up all the space nicely. I am facing 2 problems:
a) Image sizes: How do I define image sizes so that they do not become larger or smaller than wanted as the window resizes
b) Font sizes: How do I make the font size increase or decrease based on resolution - should this be done at all? (The problem I face is that the text becomes illegible at very high resolutions)
Please point me to a good reference on how to make liquid layouts.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（4）
关于b）点，恕我直言，使用相对字体大小而不是绝对字体大小是一个很好的做法，这样字体的大小就会与浏览器的基本设置相比（我猜测，从你的问题来看，你正在使用点或px 大小，是吗？）。当然，您有标题标签，但您也有 font-size CSS 属性以及以 % 或 ems 为单位调整字体大小的能力。您已经找到了使用相对大小的一个很好的理由 - 在高分辨率显示器上，这可能会使绝对大小的字体不可读（我见过，在过去 14 英寸 800x600 显示器是标准的时候，一个网站渲染的大小约为高分辨率 21 英寸显示器上的火柴盒）。还有“礼貌”和可访问性的问题 - 用户可能由于个人喜好和/或可访问性问题而将其浏览器基本字体大小设置得更大或更小，并且在我看来，将其覆盖为任意大小似乎并不可行，是个好主意。
阅读本页的字体大小部分：
http://www.w3schools.com/css/css_font.asp
如果您需要一些实际的例子，然后请发布一些你的代码和CSS。
Regarding point b) it is, IMHO, good practice to use relative font sizes, rather than absolute ones, so that the fonts are sized compared to the browsers base settings (I'm guessing, from your problem, that you are using point or px sizes, yes?). You have the heading tags, of course, but you also have the font-size CSS attribute and the ability to size fonts in % or ems. You have hit one good reason to use relative sizes - on high res monitors this can make absolute-sized fonts unreadable (I have seen, in the old days when 14" 800x600 monitors were standard, a website that rendered to about the size of a matchbox on a high-res 21" monitor). There also the issue of "politeness" and accessibility - the user may have set their browser base-font size larger or smaller because of personal preference and/or accessibility issues, and to override this to an arbitrary size doesn't seem, to me, to be a good idea.
have a read on the font-size section of this page:
http://www.w3schools.com/css/css_font.asp
If you need some actual examples then please post a bit of your code and CSS.
好文章在这里
http://www .kyleschaeffer.com/best-practices/css-font-size-em-vs-px-vs-pt-vs/
Good article here
http://www.kyleschaeffer.com/best-practices/css-font-size-em-vs-px-vs-pt-vs/
对于a）我喜欢使用这个
，如果你需要的话，添加旧浏览器中最大宽度的许多javascript修复之一。
for a) I love using this
then, if you need to, add one of the many javascript fixes for max width in older browsers.
我为您关于字体大小的第二个问题找到了一个简单的解决方案。
b) 字体大小：
使用样式表计算器和属性，例如：
vh - 视口高度
vw - 视口宽度。
您的字体大小将在您的视图中采用相同的大小，但如果您不处理小尺寸布局，则可能无法阅读。
对于常规尺寸：
font-size: calc(.5vh + .8vw);对于大尺寸：
font-size: calc(5vh + 5vw);希望这可能有所帮助你。
I found a simple solution for your second question about font size.
b) Font sizes:
Using stylesheet calculator and properties like:
vh - viewport height
vw - viewport width.
Your font size will take same size on your view, but it can be unreadable if you don't handle small sizes layout.
For regular size:
font-size: calc(.5vh + .8vw);For large size:
font-size: calc(5vh + 5vw);Hope this might help you.