반응형
position:absolute
-
<HTML/CSS> Transition 4 : Sub-Menu 만들기 - 위에서 아래로 흐르는 커튼 효과컴퓨터 알아가기/HTML CSS 2022. 9. 18. 19:30
CSS 애니메이션 기초는 Rock's Easy Web을 기본으로 공부를 하고 있습니다. 1. 연관되는 영역 Position 잡기 submenu구성에서 위에서 아래로 흐르는 커튼 효과를 만들어 보도록 하겠습니다. 영역으로 봤을때 mainmenu가 있는 태그의 position이 현재 absolute로 되어 있으므로 submenu의 position을 mainmenu에 맞게 움직이도록 position을 relative로 지정하는 것으로 시작합니다. 서로 2개의 영역을 확인하기 위해서 opacity는 빼줍니다. 다음과 같이 일단 영역을 표현할 수 있습니다. (글씨도 깨지긴 하지만 나중에 조정할 예정) submenu를 mainmenu밖으로 아예 없애도록 합니다. top값을 -로 설정하면 submenu를 올릴 수 있..