문서의 선택한 두 판 사이의 차이를 보여줍니다.
양쪽 이전 판 이전 판 다음 판 | 이전 판 | ||
wiki:sass:sass_mixin [2021/07/22 08:50] emblim98 [Using a Mixin] |
wiki:sass:sass_mixin [2023/01/13 18:44] (현재) |
||
---|---|---|---|
줄 4: | 줄 4: | ||
* author | * author | ||
* email : shlim@repia.com | * email : shlim@repia.com | ||
- | * lastupdate | + | * lastupdate |
</ | </ | ||
<WRAP clear></ | <WRAP clear></ | ||
줄 52: | 줄 52: | ||
</ | </ | ||
\\ | \\ | ||
- | 위에서 생성된 | + | 위에서 생성된 |
+ | \\ | ||
====SCSS Syntax:==== | ====SCSS Syntax:==== | ||
<code sass> | <code sass> | ||
줄 61: | 줄 63: | ||
</ | </ | ||
\\ | \\ | ||
+ | ====SCSS 구문 정리 (파일 명: mystyle.scss)==== | ||
+ | <code sass> | ||
+ | @mixin important-text { | ||
+ | color:red; | ||
+ | font-size: 25px; | ||
+ | font-weight: | ||
+ | border: 1px solid blue; | ||
+ | } | ||
+ | |||
+ | .danger { | ||
+ | @include importan-text; | ||
+ | background-color: | ||
+ | } | ||
+ | </ | ||
+ | \\ | ||
+ | |||
%%Sass%% 트랜스파일러는 상기의 예제를 일반 CSS로 변환합니다.\\ | %%Sass%% 트랜스파일러는 상기의 예제를 일반 CSS로 변환합니다.\\ | ||
- | ====CSS output==== | + | ====CSS output |
<code css> | <code css> | ||
.danger { | .danger { |