CSS3 애니메이션 상속 금지

Question

div 상자를 확대하는 CSS3 애니메이션이 있습니다. 이 div에는 하위 요소 "p"가 포함되어 있습니다. div 상자에 애니메이션 클래스를 설정하면 p 태그가 애니메이션을 상속합니다. 하지만 부모 div 요소에만 애니메이션을 실행하고 자식은 실행하지 않습니다.

애니메이션 (-webkit-animation) 상속을 방지하려면 어떻게해야합니까? 아이에게 -webkit-animation : none을 설정하려고했지만 작동하지 않습니다.

Answer 1

는 이제 작동합니다 http://jsfiddle.net/fiddly/FwHZn/1/

나는 "P"-tag의 폭을 설정했다. 그렇지 않으면 애니메이션이 div 및 p 태그에 적용됩니다.

Answer 2

당신이 당신이

Answer 3

이 때문에 아이 p의 어떤 애니메이션이 없다 애니메이션하고자하는 특정 요소를 선택할 수 있습니다 대신 있도록 DIV에 (귀하의 경우 높이, 폭) JQuery와 애니메이션을 사용하여 시도 할 수 자식 p은 div 안에 렌더링됩니다. 렌더링 된 애니메이션은 div입니다. 당신은 CSS로 아이 p를 숨기려고 할 수 있습니다

div#yourDivId p { 
    display: none; 
    visibility: hidden; 
}