본문 바로가기
CSS/SASS

[SCSS]@mixin / @function/@extend 차이

by 알찬 퍼블리셔 2022. 8. 1.
728x90
반응형

-  @mixin 사용법

@mixin 믹스인이름(매개변수){
	스타일;
    }
    
@include 믹스인이름(매개변수); //정의된 내용만 사용
또는 
@include 믹스인이름(매개변수){
	스타일;
}; // 정의된내용 + 추가 스타일 적용

스타일의 묶음을 재사용할때 사용

 

- function

@function 함수이름(매개변수){
	계산식
    @return 결과값; 
}

값을 반환한다 

 

-@extend

@extend 선택자

 

 

@mixin과 @extend 의 차이 한방에 이해할수 있는 글

https://13akstjq.github.io/sass/2020/02/22/mixin%EA%B3%BC-extend-%EC%95%8C%EB%A7%9E%EA%B2%8C-%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0.html

 

웹 개발 기술 블로그

웹 개발에 필요한 지식을 기록하는 블로그입니다.

13akstjq.github.io

 

728x90
반응형

댓글