Be ready to study forever - 개발자 꿈나무

[Sass 문법 정리] 8. Sass내장함수들 본문

Programming/CSS

[Sass 문법 정리] 8. Sass내장함수들

루눌룹 2020. 7. 22. 23:43

4.14. 내장함수들

미리 정의된 함수들입니다. 정의된 모든 함수는 https://sass-lang.com/documentation/modules에서 확인 가능합니다. 설명의 [ ]안에 들어가는 인자는 기본값이 있으므로 적어 넣지 않으면 기본값이 작동합니다.

4.14.1. 색상 함수

mix($color1, $color2) : 개의 색을 섞습니다.

lighten($color, $amount) : 밝은색을 만듭니다.

darken($color, $amount) : 어두운색을 만듭니다.

saturate($color, $amount) : 색상의 채도를 올립니다.

desaturate($color, $amount) : 색상의 채도를 낮춥니다.

grayscale($color) : 색상을 회색으로 변환합니다.

invert($color) : 색상을 반전시킵니다.

rgba($color, $alpha) : 색상의 투명도를 변경합니다.

opacify($color, $amount) / fade-in($color, $amount) : 색상을 불투명하게 만듭니다.

transparentize($color, $amount) / fade-out($color, $amount) : 색상을 투명하게 만듭니다.

 

4.14.2 문자 함수

unquote($string) : 문자에서 따옴표를 제거합니다.

quote($string) : 문자에 따옴표를 추가합니다.

str-insert($string, $insert, $index) : 문자의 index번째에 특정 문자를 삽입합니다.

str-index($string, $substring) : 문자에서 특정 문자의 index 반환합니다.

str-slice($string, $start-at, [$end-at]) : 문자에서 특정 문자( 번째 글자부터 번째 글자까지) 추출합니다.

to-upper-case($string) : 문자를 대문자를 변환합니다.

to-lower-case($string) : 문자를 소문자로 변환합니다.

 

4.14.3 숫자함수

percentage($number) : 숫자(단위 무시) 백분율로 변환합니다.

round($number) : 정수로 반올림합니다.

ceil($number) : 정수로 올림합니다.

floor($number) : 정수로 내림(버림)합니다.

abs($number) : 숫자의 절대 값을 반환합니다.

min($numbers…) : 숫자 최소 값을 찾습니다.

max($numbers…) : 숫자 최대 값을 찾습니다.

random() : 0 부터 1 사이의 난수를 반환합니다.

 

4.14.4 List 함수

모든 List 내장 함수는 기존 List 데이터를 갱신하지 않고 List 데이터를 반환합니다.
모든 List 내장 함수는 Map 데이터에서도 사용할 있습니다.

length($list) : List 개수를 반환합니다.

nth($list, $n) : List에서 n번째 값을 반환합니다.

set-nth($list, $n, $value) : List에서 n번째 값을 다른 값으로 변경합니다.

join($list1, $list2, [$separator]) : 개의 List 하나로 결합합니다.

zip($lists…) : 여러 List들을 하나의 다차원 List 결합합니다.

index($list, $value) : List에서 특정 값의 index 반환합니다.

 

4.14.5. Map 함수

모든 Map 내장 함수는 기존 Map 데이터를 갱신하지 않고 Map 데이터를 반환합니다.

map-get($map, $key) : Map에서 특정 key value 반환합니다.

map-merge($map1, $map2) : 개의 Map 병합하여 새로운 Map 만듭니다.

map-keys($map) : Map에서 모든 key List 반환합니다.

map-values($map) : Map에서 모든 value List 반환합니다.

 

4.14.6. 관리함수

variable-exists(name) : 변수가 현재 범위에 존재하는지 여부를 반환합니다.(인수는 $없이 변수의 이름만 사용합니다.)

unit($number) : 숫자의 단위를 반환합니다.

unitless($number) : 숫자에 단위가 있는지 여부를 반환합니다.

comparable($number1, $number2) : 개의 숫자가 연산 가능한지 여부를 반환합니다.

Comments