css3 키 프레임 애니메이션을위한 SASS (SCSS 아님) 구문

css3 키 프레임 애니메이션을위한 SASS (SCSS 아님) 구문

---

SASS에서 키 프레임을 작성하는 방법이 있습니까?

내가 찾은 모든 예는 SASS라고 말할 때도 실제로 SCSS입니다. 명확하게 말하면 중괄호가없는 것을 의미합니다.

---

다음은 Sass 구문에서 CSS 키 프레임을 구현하는 방법입니다.

@keyframes name-of-animation
  0%
    transform: rotate(0deg)
  100%
    transform: rotate(360deg)

다음은 공급 업체 접두사를 추가하는 Sass 믹스 인입니다.

=keyframes($name)
  @-webkit-keyframes #{$name}
    @content
  @-moz-keyframes #{$name}
    @content
  @-ms-keyframes #{$name}
    @content
  @keyframes #{$name}
    @content

다음은 Sass 구문에서 mixin을 사용하는 방법입니다.

+keyframes(name-of-animation)
  0%
    transform: rotate(0deg)
  100%
    transform: rotate(360deg)

참고 URL : https://stackoverflow.com/questions/18894981/sass-not-scss-syntax-for-css3-keyframe-animation