<a href="#">hover <div class="div2"> <p>qwerqwerqwer</p> </div> </a>
a:hover .div2{
animation: 0.5s div2 ease-in forwards;
}
a:hover p{
display: block;
}
@keyframes div2{
0%{height: 0; }
100%{height: 200px; }
}
.div2{
width: 200px;
background-color: red;
}
p{
display: none;
} 
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
div에 p태그가 있는데 a:hover를 하고 싶은데 div가 먼저 확장된 후 p태그가 표시되면 어떻게 해야 하나요? -PHP 중국어 사이트 Q&A-div에 p 태그가 있습니다. a:hover를 하고 싶은데 div가 먼저 확장된 후 p가 표시되면 어떻게 해야 하나요? -PHP 중국어 홈페이지 Q&A
꼭 보고 배워보세요.
a:hover .div2{ animation: 2.5s div2 ease-in forwards; } a:hover p{ display: block; animation: 0.5s div1 ease-in forwards; animation-delay:2.5s; } @keyframes div2{ 0%{height: 0; } 100%{height: 200px; } } @keyframes div1{ 0%{opacity: 0; } 100%{opacity: 1; } } .div2{ width: 200px; background-color: red; } p{ opacity: 0; display: none; }