2016-10-31 1 views
0

예를 들어 CSS를 사용하지 않고 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>

답변

0

당신이 당신은 용기를 상대 높이를 제공하는 비율 높이를 사용할 수 있습니다, 부모 요소에 높이를 정의합니다.

예를 들어

:

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

CSS :

body{ 
    height: 500px; 
} 

foo{ 
    height:50%; 
} 
+0

어떤 신체 헤이트는 다음과 같이 정의 된 경우에 대한 : 몸 { 폭 : 자동; 신장 : 100 %; } – wisnia80

+0

컨테이너는 상대 값을 사용하기 위해 값을 상속해야합니다. 예를 들어 foo 값의 100 %가 body = 500px에서 상속됩니다. – diaco