初期値なしでdivをリサイズ

例のように初期高さなしにdivをリサイズできるのであれば、私はちょっと迷っています。最初の高さのトランジションを削除しても動作は停止しますが、divはスチルのサイズ変更です。 220pxの高さの状態を取り除いている間、トランジションを維持する方法。初期値なしでdivをリサイズ

今私が使用しています：

.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>

出典

2016-10-31 wisnia80

を使用すると、その親要素に高さを定義した場合、あなたはコンテナに相対的な高さを与える割合の高さを使用することができます。例えば

：

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

CSS：本体ハイトは、以下のように定義されている場合約

body{ 
    height: 500px; 
} 

foo{ 
    height:50%; 
}

出典

2016-10-31 18:57:36 diaco

どの：本体{幅：オート。高さ：100％; } – wisnia80

コンテナは、その相対値を使用するために値を継承する必要があります。たとえば、値fooの100％はbody = 500pxから継承します。 – diaco

初期値なしでdivをリサイズ

答えて

関連する問題