밑줄효과1 2021-05-21 (39일차) float-grid, 밑줄 애니메이션, flex, flex-grow, 수직정렬방법 align-items, align-self, 버튼만들기 149강~150강 - float-grid .float-grid::after { content:""; display:block; clear:both; } .float-grid > * { float:left; box-sizing:border-box; } - 밑줄 애니메이션 1) 좌 > 우 효과를 주고 싶은 태그의 뒤 or 앞에 absolute를 놔주기 ex) 태그::after { content:""; background-color:white; width:0; height:2px; position:absolute; bottom:0; left:0; transition:width .3s; } :hover > a::after { width:100%; } 2) 가운데 > 양쪽 효과를 주고 싶은 태그의 뒤 or 앞에 .. 2021. 5. 22. 이전 1 다음