【问题标题】:Zoom and resolution缩放和分辨率
【发布时间】:2012-12-24 11:47:03
【问题描述】:
  1. 我以百分比形式给出了高度和宽度。甚至字体大小。 现在放大,容器的高度和宽度不会改变,但字体大小会改变。它会导致问题,因为文本会在放大时从容器中出来。
  2. 如果我以固定像素为单位给出高度宽度,它可以很好地使用缩放,因为容器和内部文本在缩放时同步,但是这样网站会在不同的分辨率下获得水平滚动,这又是不希望的。

有没有办法同时解决这两个问题?

My page on JSBIN

【问题讨论】:

  • 这是一个移动网站吗?我看到你在页脚中使用了一个表格。将表格用于布局目的是一种不好的做法。表格只能用于显示表格数据。
  • 你是对的。你也想回答这个问题吗?即使我避免了这种不良做法,我仍然无法解决问题
  • 如我所说,它是移动网站吗?如果是这样,您应该添加一个视口标签。您可以在该标签中将其设置为不可用户扩展。 developer.mozilla.org/en-US/docs/Mobile/Viewport_meta_tag

标签: html css zooming responsive-design screen-resolution


【解决方案1】:

百分比是相对于父元素大小的。将这种关系一直外推到body,您的窗口大小不会改变,因此元素的大小不会改变。如果您调整窗口大小,则元素将随着父元素的尺寸变化而调整大小。

如果您希望元素更改大小,请使用em 调整大小,因为这是根据默认浏览器font-size(通常为16px)设置的。当您放大和缩小时,元素的大小应与字体一起调整。

Ethan Marcotte 为 A List Apart 写了一篇出色的文章,描述了如何使用 em 实现流畅的布局:http://www.alistapart.com/articles/fluidgrids/

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2016-07-27
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2010-09-16
    • 2013-09-09
    • 2015-04-25
    • 2016-10-21
    相关资源
    最近更新 更多