반응형
.box {
animation-name: boxKeyframes;
-webkit-animation-duration: 170ms;
-webkit-animation-timing-function: cubic-bezier(0.420, 0.000, 0.580, 1.000);
}
@-webkit-keyframes boxKeyframes{
from{
background-color: rgba(0,0,0,0);
}
to {
background-color: rgba(0,0,0,0.7);
}
}
kutar37.tistory.com/entry/CSS-cubic-bezier%EB%9E%80
CSS : cubic-bezier란?
cubic-bezier란? cubic-bezier() function은 CSS에서 transition 속성 혹은 transition-timing-function 속성에서 전환 시작과 끝까지의 효과를 제어하는데 쓰인다. #target{ transition: all 0.5s cubic-bez..
kutar37.tistory.com
[CSS] animation-timing-function
animation-timing-function animation-timing-function 속성은 움직임의 속도를 정의합니다. animation-timing-function animation-timing-function 속성은 움직임의 속도를 정의합니다.. 특징 설명 기본 값 anima..
webzz.tistory.com
참고
반응형
'CSS' 카테고리의 다른 글
[CSS] 크롬과 shadow 관련 (0) | 2022.01.20 |
---|---|
[css] 디버깅 (0) | 2022.01.20 |
[css] css 관련 요즘 추세 볼 수 있는 사이트 (0) | 2022.01.20 |
[css] webkit keyframes (0) | 2021.03.16 |
[CSS] 부트스트랩, materialize, semantic-ui 사이트 (0) | 2021.03.11 |