【问题标题】:How to align divs horizontally in a consistent way?如何以一致的方式水平对齐 div?
【发布时间】:2012-02-28 01:08:53
【问题描述】:

在我的 HTML 中,我想将 8 个彩色 div 水平对齐,并用常量空间分隔。 我有一个<table> 作为这些 div 的容器。大小以百分比(%)而不是像素(px)来指定用于缩放。

当用户调整窗口大小时,div 也会调整大小,但比例不相等(即高度!=宽度),结果看起来像矩形而不是正方形。我想以这样一种方式对齐这些 div,当用户调整窗口大小时,这些 div 也会以相同的比例调整大小,并保持它们的方形。

【问题讨论】:

  • 我可以看到实际的 HTML 和 CSS 吗?
  • 最好能回过头来接受您提出的问题的答案。

标签: html css


【解决方案1】:

没有纯粹的 HTML/CSS 解决方案来以保持其比例的方式缩放 div - 您需要使用一些脚本。查看可以在此处使用的 JQuery 解决方案:Scale a div to fit in window but preserve aspect ratio

【讨论】:

  • 我不会投票给您,因为我不确定您在该声明中的确切含义,但如果您的意思是无法使用纯 HTML/CSS 保留 div 的纵横比,你误会了。请参阅我在您链接的页面中介绍的两种方法。
【解决方案2】:

您可以在每个块中放置带有width: 100% 的透明方形GIF 图片(1×1px 就足够了)。无论width: 100% 的特定计算像素值如何,图像及其容器的尺寸都会自动保持不变。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2013-04-16
    • 2017-11-05
    • 1970-01-01
    • 2021-05-24
    • 2020-10-17
    • 2010-09-18
    • 1970-01-01
    • 2019-12-16
    相关资源
    最近更新 更多