반응형
애니메이션 부여 과정
1) 애니메이션 속성 부여 (개별 부여)
선택자: {스타일 내용;
animation-name: 애니메이션 이름 부여; /* 원하는 선택자에 애니메이션 이름 부여 */
animation-duration: 숫자(단위:ms/s); /* 애니메이션 지속되는 시간 */
animation-iteration-count:값; /* 애니메이션 반복여부. 숫자, infinite(무한반복) 등 */
}
선택자:visited {스타일 내용}
적용 스타일값 - font-weight: 글자 두께 / font-shadow: 글자 그림자 (상하,좌우,번짐정도,색상)
3. 커서가 올라가있을 때 (Tab키를 누르면 선택이 달라지는 때)
선택자:focus {스타일 내용}
적용 스타일값 - font-weight: 글자 두께 / font-shadow: 글자 그림자 (상하,좌우,번짐정도,색상)
4. 마우스로 클릭했을 때
선택자:active {스타일 내용}
적용 스타일값 - font-weight: 글자 두께 / font-shadow: 글자 그림자 (상하,좌우,번짐정도,색상)
반응형
'html+CSS+JS > html+CSS' 카테고리의 다른 글
[CSS/js] 수정/배포로 파일 업데이트 시, 캐시 방지 & 강력 새로고침(캐시초기화) (0) | 2020.05.29 |
---|---|
[css] position : static, relative, absolute, fixed (0) | 2019.09.11 |
[CSS] inline, block, inline-block 차이점 (0) | 2019.06.28 |
[CSS] 이미지 중심점 바꿔서 회전 시키기 (transform:rotate, transform-origin) (0) | 2019.06.27 |
[CSS] 선택자:특정 상태 (hover, visited, focus, active) (0) | 2019.06.27 |