html - 如何在 CSS 中使用百分比使 div 可缩放

Question

您好，我有一个关于可伸缩 div 的问题。我知道我们可以做类似的事情

<pre>
    <code>
        img {
            width: 100%;
            height: 98%;
        }
    </code>
</pre>

这将使图像在调整窗口大小时可缩放。但是如何在普通 div 中实现相同的效果呢？我也想指定最小宽度和最小高度。因此，关于 div 内的内容，我希望 div 为 450x300，但是当调整窗口大小时，div 也需要能够将其大小反射(reflect)到窗口。然而，当我做类似的事情时

<pre>
    <code>
    div {
        min-width: 450px;
        min-height: 300px;
        width: 100%;
        height: 100%;
    }
    </code>
</pre>

我怀疑它也不适用于所有浏览器。请建议我解决这个问题。

已更新 这是我的代码示例 http://jsfiddle.net/noppanit/Xfpp7/

我想做的是无论图像有多大，“某些文本”的 div 都必须与图像具有相同的大小。当您调整窗口大小时，“某些文本”会以与图像相同的速率缩小或增大。不确定这在纯 CSS、HTML 中是否完全可行。多谢。

Answer 1

好的，两个潜在的问题:

• 您的最低高度有错字
• 您是否也指定了 div 容器的高度？例如，如果div直接在body中，你必须给body一个特定的高度，浏览器不会知道它是什么。

编辑:
要回答您的评论，如果您希望 div 在大屏幕上为 450 像素宽，但要在屏幕较小时缩小，则需要 max-width 而不是 min-width.