스타일러스(스타일시트 언어)
Stylus (stylesheet language) |
 | |
| 설계자 | TJ 홀로웨이추크 |
|---|---|
| 개발자. | LearnBoost(- 2015년 3월 26일)/ 오토매틱(2015년 3월 26일 - 현재)[1] |
| 첫 등장 | 2010; 전( |
| 안정적 해제 | 0.54.8[2] / 2020년 7월 16일; 전 |
| 타이핑 규율 | 동적인 |
| OS | 크로스 플랫폼 |
| 면허증 | MIT 라이선스 |
| 파일 이름 확장명 | .styl |
| 웹사이트 | 스타일러스(기투브) |
| 영향을 받은 | |
| CSS, Sass, REST | |
스타일러스는 CSS(Cascading Style Sheet)로 컴파일된 동적 스타일시트 전처리기 언어다.그것의 디자인은 Sass와 LESS의 영향을 받는다.그것은 네 번째로 가장 많이 사용되는 CSS 전처리기 구문으로 간주된다.[3]그것은 Node.js의 프로그래머였고 루나 언어를 만든 TJ 홀로웨이추크가 만들었다.그것은 JADE와 Node.js로 쓰여 있다.
선택기
가새로 선언 블록을 열고 닫는 CSS와는 달리 들여쓰기가 사용된다.또한 세미콜론(;)은 선택적으로 생략된다.따라서 다음 CSS:
보디 { 색을 칠하다: 백색의; } 다음과 같이 단축할 수 있다.
보디 색을 칠하다: 백색의 또한, 콜론 (:)과 콤마 (,)도 선택사항이다. 즉, 위의 내용을 다음과 같이 쓸 수 있다.
보디 색을 칠하다 백색의 변수
스타일러스는 변수를 정의할 수 있지만, RESS나 Sass와는 달리 변수를 정의할 때는 기호를 사용하지 않는다.또한 속성 및 키워드를 구분하여 변수 할당이 자동으로 수행된다.이렇게 해서 변수는 파이썬의 변수와 비슷하다.
메세지 = '안녕, 월드!' 칸막이하다::전에 내용물 메세지 색을 칠하다 #피프 Stylus 컴파일러는 위의 문서를 다음과 같이 번역할 것이다.
칸막이하다::전에 { 내용물: '안녕, 월드!'; 색을 칠하다: #FFFF; } 믹싱 및 함수
믹싱과 함수 모두 동일한 방식으로 정의되지만 다른 방식으로 적용된다.
예를 들어 다양한 공급업체 접두사를 사용하지 않고 CSS 경계선 반지름 속성을 정의하려면 다음을 생성하십시오.
국경의(n) -웹킷-국경-국경-국경-국경-지침 n -국경-국경-국경-국경-국경-국경간 n 국경의 n 이를 혼합물로 포함하려면 다음을 참조하십시오.
칸막이하다.직사각형 국경의(10시 30센트) 이를 컴파일할 수 있는 대상:
칸막이하다.직사각형 { -웹킷-국경의: 10px를 붙이다; -210-국경의: 10px를 붙이다; 국경의: 10px를 붙이다; } 보간법
변수 및 식별자에 변수를 포함하려면 가새 문자를 변수 주위에 두십시오.예를 들어,
-웹킷-{'경계' + '-'-'} 로 평가하다.
-웹킷-국경-국경-국경-국경-지침 참조
- ^ "LICENSE". GitHub. 2015-03-26. Retrieved 2015-12-21.
- ^ "Release 0.54.8". GitHub. 2020-07-16. Retrieved 2021-04-06.
- ^ 의견조사 결과: CSS 프리프로세서의 인기
