# Sass

30개의 포스트
post-thumbnail

포트폴리오(05 : Sass와 styled-components)

반응형 레이아웃을 만들기 위해서는 미디어쿼리를 활용한 css, flexbox를 활용한 css 등 css의 활용이 여러모로 필요하다.이번 포트폴리오에서는 material ui 디자인 프레임 워크를 사용하기로 했는데 예시에서 아래 코드처럼 스타일링 해주는걸 볼 수 있었다.

2020년 5월 7일
·
0개의 댓글

SassScript

Sass는 css를 javascript처럼 변수를 사용할 수 있고, 변수의 scope가 존재하며, 연산자란 개념도 있으며, 7가지 데이터 타입을 제공한다.Sass에 대해서 공부할수록 Javascript와 사용하는 방식이 동일하다고 생각을 많이하였다.이처럼 변수를 선언하

2020년 5월 4일
·
0개의 댓글
post-thumbnail

TSL : 2020-04-29

오늘은 scss를 이용해 반응형 웹을 만들기 위해 mixin을 배웠다.

2020년 4월 29일
·
0개의 댓글
post-thumbnail

Sass?

Syntactically Awesome Style Sheets, Css의 pre processor로써 코드의 가독성과 재 활용성을 높여주고 복잡한 작업을 쉽게 할 수 있게 해줍니다.😳sass 인터프리터는 .sass, scss 파일을 모니터링 하다가 파일이 저장될 때마

2020년 4월 11일
·
0개의 댓글

CSS & SCSS & SASS

CSS를 익히며 SCSS, 그리고 SASS라는 것에 대해 들어봤지만 왜 쓰는지 어떻게 쓰는지 차이는 무엇인지에 대해 정확히 알고 있지 않다가 이번에 정리를 해보려고 한다.결론은 SCSS와 SASS는 CSS를 쉽고 추가 기능도 있는 확장판정도로 생각하면 좋을 것 같다.그

2020년 4월 9일
·
0개의 댓글
post-thumbnail

TSL : 2020-03-25

sass 공부하기

2020년 3월 25일
·
0개의 댓글
post-thumbnail

Sass 시작하기

시작하기 앞서 모든 내용은 Sass 공식 가이드라인을 참고하여 작성했습니다.개인적인 정리이니 오타, 생략한 내용이 있습니다.정확한 정보를 위해 공식 가이드라인을 보시는 것을 추천드립니다. 🤗사스는 기초 언어에 힘과 우아함을 더해주는 css의 확장이다.Sass의 궁극적

2020년 3월 17일
·
0개의 댓글
post-thumbnail

Svelte#1 - Svelte scss/eslint 관련 vscode 설정

svelte관련해서 scss와eslint를 설정 하다가 좀 애먹은 부분이 있어서 공유 및 기록한다.

2020년 3월 3일
·
2개의 댓글

Wecode 24일차-TIL

Sass에 대해서

2020년 2월 23일
·
0개의 댓글

SASS/SCSS 설치부터 간단 사용법 정리

SASS & SCSS란? SASS(Syntactically Awesome StyleSheet)는 CSS의 단점을 보완한 CSS의 확장형이다. 그리고 SCSS는 SASS를 더 편리하게 수정한 버전이다. 확장자는 .scss 사용하며, 브라우저에서 SASS구문을 이해하지 못

2020년 2월 20일
·
0개의 댓글

[TIL] JS Study

-bind( )가 뭐야?

2020년 2월 20일
·
0개의 댓글

TIL - 프론트 엔드 스터디

//css.text { width: 80%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }h1 { background:url("h1 { background:url(h1 { background:url

2020년 2월 20일
·
0개의 댓글
post-thumbnail

[sass,destructuring, bind, export]스터디

1.sass에서 자주 쓰이는 팁 3개 이상 공유mixinSass의 아주 유용한 기능 중 하나로 extend와 비슷하지만 argument(인자)를 받을 수 있다.선언할 때는 @mixin 이름 사용할 때는 @include 이름 SassCSSmixin 응용Sass @cont

2020년 2월 20일
·
0개의 댓글

(TIL 24일차) 프론트팀 스터디 및 백연동 데이터 가져오기

sass팁 비구조화할당 export 유무 this의 차이 fetch token storage

2020년 2월 20일
·
0개의 댓글

TIL #24. JS스터디: sass/비구조화 할당/bind/리액트에서 export

(20/2/20)Sass(Syntactically Awsome StyleSheets)는 CSS pre-processor(전처리기)이다. 전처리기는 CSS의 단점을 보완하여 보다 가독성이 높고 코드의 재사용에 유리한 CSS를 생성해준다. (전처리기에는 Sass, Less

2020년 2월 20일
·
0개의 댓글

TIL 2020.02.20.목

1.api 붙이기 실습 (인증, 인가) / 2.JavaScript 일일 스터디

2020년 2월 19일
·
0개의 댓글

(TIL 17일차) React (7)

React Sass CSS-moudles styled-components

2020년 2월 13일
·
0개의 댓글

Scss - mixin basics

@mixin으로 선언하고 @include로 불러온다. 일반적으로 @extend 대신 mixin을 사용하는 것을 권장한다(https://sass-guidelin.es/ko/#extend) examples (from https://poiemaweb.com/sass-css-extention)

2020년 2월 8일
·
0개의 댓글

Next.js + Sass

Import .sass or .scss files in your Next.js project https://github.com/zeit/next-plugins/tree/master/packages/next-sass

2020년 2월 6일
·
0개의 댓글

Sass 기초

Sass 기초

2020년 2월 3일
·
0개의 댓글