background-image: linear-gradient(transparent calc(100% - 1.5px), $BLUE_COLOR 5px);
background-repeat: no-repeat;
background-size: 0% 100%;
@keyframes underLining {
100% {
background-size: 100% 100%;
}
}
애니메이션으로 키프레임만 추가하면 밑줄긋는 애니메이션 사용 가능
background-image 안에 calc는 계산식 즉 gradient로 되어있는 이미지에 높이를 조정하는것.
background size: 가로 세로 값중에서 가로를 임의로 0으로 셋팅해놓고 100%로 만드는 기법
(ps. background-image쪽 $는 scss 용법임)