# scss

242개의 포스트
post-thumbnail

2021.12.03 TIL

0.CSS 1.SASS(SCSS) 3.CSS속성

어제
·
0개의 댓글
post-thumbnail

Svelte 프로젝트에 도입하기

친구에게 갈비탕값을 하기 위해서 급식 메뉴 투표 결과를 보여주는 프로젝트를 만들게 되었는데, 이번 기회에 svelte를 써보게 되었고, 경험하게된 것을 나누고자 합니다!

3일 전
·
2개의 댓글
post-thumbnail

[SASS] 01. 내가 보려고 작성한 SASS 문법(SCSS)

편의상 scss로 지칭터미널에서 아래의 명령어를 입력하여 설치$ npm i -g sasssass-project 디렉토리 생성하고 트랜스파일링할 scss 파일을 생성트랜스파일링할 sass 파일의 경로와 트랜스파일링 후 생성될 css파일의 경로 지정$ sass foo.ss

3일 전
·
0개의 댓글
post-thumbnail

TIL 014 | Sass(SCSS) 조건문 & 반복문 & 함수

Today, I Learned.멋쟁이 사자처럼 프론트엔드 스쿨에서 배운 내용 정리. - Sass(SCSS) 조건문 & 반복문 & 함수.

5일 전
·
1개의 댓글
post-thumbnail

[Webpack] 렌더링된 image url이 base64로 나올때

scss 소스 상에서는 상대경로로 작성한 이미지파일 경로가 개발자도구에서는 base64로 나오는 상황webpack.config.js 파일에서 limit을 수정해줘야 한다. limit 보다 작은 파일은 base64로 변환하고 큰 파일은 그대로 보여주기 때문!

5일 전
·
0개의 댓글
post-thumbnail

TIL 013 | Sass(SCSS) Mixin & Extend

Today, I Learned.멋쟁이 사자처럼 프론트엔드 스쿨에서 배운 내용 정리. - Sass(SCSS) Mixin & Extend.

5일 전
·
0개의 댓글
post-thumbnail

TIL 012 | Sass(SCSS) Variable & Operator

Today, I Learned. [멋쟁이 사자처럼 프론트엔드 스쿨]에서 배운 내용 정리. - Sass(SCSS) Variable & Operator.

7일 전
·
0개의 댓글
post-thumbnail

CSS, SCSS, SASS 차이는??

1. ToDo - 그냥 문득 차이가 뭔지 궁금해짐..? 2. 일단 코드 차이부터! > ### HTML 기준으로 보자! > ### CSS에서는?? > ### SCSS에서는?? > ### SASS에서는?? 3. 왜 써?? CSS의 단점 : 프로젝트가 커지면 Selector가 많아지고 스타일을 계속 추가하게 되면 가독성이 떨어지고 구문의 한계가 있다. ...

2021년 11월 28일
·
0개의 댓글
post-thumbnail

SCSS

2021년 11월 26일
·
0개의 댓글

2021.11.25 Today I Learned

지난시간 SASS, SCSS에 대한 간략한 소개와 기본적인 구조 및 Nesting(중첩)에 대해 알아보았다. 오늘은 이어서 좀 더 구체적이고 자세한 이야기를 해보려한다.우선 Nesting의 주의할 점에 대해 좀 더 자세히 짚고 넘어가야하는데 Nesting이 부모요소를

2021년 11월 25일
·
0개의 댓글
post-thumbnail

[TIL] Sass - mixin, extend

1. Mixin?? 믹스인이란, 코드의 재사용을 위해 만들어진 기능이다. 반복되는 코드를 다시쓰는 작업을 없애기 위해 만들어진 기능이다. (중앙정렬을 위한 flex, justify, align 묶음 정도를 생각하면 좋다) 반복되는 코드를 묶어놓은 것이라고 생각하면 된

2021년 11월 25일
·
0개의 댓글
post-thumbnail

[TIL] Sass - variables

1. Why Variables?! >변수를 선언한다 = 값을 일일이 작성하지 않는다 일정한 테마를 가진 웹 이라면, 배경색이나 헤딩의 폰트 사이즈, 본문의 폰트 사이즈 등등등 동일한 스타일을 줄 경우가 생긴다.(아주 많이) 이 때마다 그 값을 어딘가에서 보고 써넣거나

2021년 11월 25일
·
0개의 댓글
post-thumbnail

Sass

Sass란? CSS로 컴파일 되는 스타일 시트 확장 언어이며, CSS 전처리기의 하나 입니다. 브라우저가 Sass를 직접 로딩하는 방식이 아닌, Sass로 개발을하고, CSS로 익스포트하는 과정을 지나 최종적으로는 CSS를 받아와야 됩니다. Sass를 기술 하는

2021년 11월 24일
·
3개의 댓글
post-thumbnail

2021.11.24 Today I Learned

Sass는 기존의 CSS를 보완해주기 위해 만든 스타일시트 언어이며 CSS의 전처리기이다. sass를 작성하여 바로 html의 링크로 들어가는 것이 아닌 sass가 css로 변환되어 html의 link로 들어가진다.예를 들어 001.sass를 작성하면 001.sass가

2021년 11월 24일
·
0개의 댓글
post-thumbnail

TIL 20211124 - Sass

alias : alias ls = 'ls -a'등 축어 지정 unalias ls 로 해제man : 메뉴얼nslookup: 도메인 명령으로 IP 조회ping : 접속 테스트traceroute : 추적 명령어fg,bg : 프로세스를 백그라운드나 포그라운드로 옮김jobs :

2021년 11월 24일
·
0개의 댓글
post-thumbnail

CSS의 진화과정

CSS, SCSS, BEM, CSS Modules, Styled-Components

2021년 11월 23일
·
0개의 댓글
post-thumbnail

조건문

if 조건문을 이용한 분기

2021년 11월 22일
·
0개의 댓글
post-thumbnail

함수 (Function)

함수 정의하는 방법과 사용 방법

2021년 11월 22일
·
0개의 댓글
post-thumbnail

@extend

@extend를 이용한 스타일 확장

2021년 11월 22일
·
0개의 댓글
post-thumbnail

Mixin (재활용)

Mixin을 이용한 스타일의 재활용

2021년 11월 20일
·
0개의 댓글