调整大小 div 没有初始值

Question

我只是在徘徊，如果可以只使用 css 调整 div 的大小，而不像示例中那样初始高度为 220px（以具有响应式 div）。如果我删除初始高度转换停止工作，但 div 仍在调整大小。如何在移除 220px 高度条件的同时保持过渡。

现在我正在使用：

.resize{
    height: 220px;
    width:auto;
    background: red;
    transition:         all 1.0s  ease-in-out;
    -moz-transition:    all 1.0s  ease-in-out;
    -webkit-transition: all 1.0s  ease-in-out;
    -o-transition:      all 1.0s  ease-in-out;
    -ms-transition:     all 1.0s  ease-in-out;
}

.resize:hover{
    height: 340px;
}

<div class="resize">
  This is resizable div
</div>

Answer 1

如果为其父元素定义高度，则可以使用百分比高度为容器提供相对高度。

例如：

<body>
    <div class="foo">
    This container will have a relative height
    </div>
</body>

CSS:

body{
    height: 500px;
}

foo{
    height:50%;
}

调整大小 div 没有初始值

Resize div without initial value

css

resize