transition1 CSS 테두리 효과 애니메이션(css border animation) 안녕하세요! 오늘 만들어 볼 css 애니메이션은 테두리가 시계방향으로 생성 되며 채워지는 border animation입니다. 결과 화면 부터 확인 해 볼까요? 위와 같이 시계방향으로 테두리가 생성되며 나타나고 반대로 지워질 때는 반시계 방향으로 테두리를 지우는 효과를 직접 만들어 보겠습니다. 우선 효과를 적용할 html 태그부터 만들어 보겠습니다. 1. 효과를 적용할 요소 생성 & 스타일 적용 [html] Border Effect 위 코드와 같이 a 태그 영역 안에 텍스트를 입력하고 테두리 효과를 적용할 span 태그를 상하좌우 각각 하나씩 총 4개를 만들어 줍니다. span 태그의 경우 absolute 속성을 주어 위치를 지정해 줄 예정 이어서 a 태그의 position 솏성은 relative로 설정.. 2022. 12. 19. 이전 1 다음