일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
- transform
- margin
- display:none
- vw
- navbar
- TRANSITION
- Position
- JQuery
- css selector
- EventListner
- 이벤트 버블링
- absolute
- Carousel
- position : fixed
- val()
- 밀리초
- form
- z-index
- scss
- setTimeout
- bootstrap
- 레이아웃
- hover
- animate
- togle
- input
- sass
- CSS
- float : left
- css animation
- Today
- Total
목록scss (2)
Simple Is Best
이번 포스팅에서는 SCSS 핵심 문법에 대해서 알아보겠습니다. 1. @import : [CSS Nomalize]에 대해서 기억하시나요? CSS 최상단에 기본적으로 적용시키는 CSS 코드를 Nomalize라고 부르는데 이를 CSS 파일을 쓸 때 마다 복사 붙여넣기 하면 가독성도 떨어지고 시간도 많이 소요됩니다. 이러한 CSS Nomalize 내용을 담기 위해서 동일한 폴더 내에 _reset.scss 파일을 생성하였습니다. ▶ test.scss에서 코딩한 내용은 새로고침 할 때 마다, 자동으로 test.css 에 반영됩니다. ★ 참고 : _는 컴파일 금지명령입니다. _reset.scss body { margin : 0px; } div { box-sizing: border-box; } 이를 test.scss ..
이번 포스팅에서는 CSS의 전처리엔진인 SCSS/SASS에 대해서 알아보겠습니다. ▶ SCSS/SASS : CSS의 전처리 엔진 CSS를 더욱 쉽게 작성하게 끔 해주는 tool ▷ SASS 와 SCSS의 차이점 - SCSS가 기존의 CSS와 문법적으로 유사하므로 SCSS에 대한 학습을 진행하겠습니다. SASS : 괄호, 세미콜론 X SCSS : 괄호, 세미콜론 O SCSS로 작성된 문법은 반드시 CSS로 변환하여 HTML 파일에 첨부해야 합니다. 웹브라우저는 오직 [HTML, CSS, JavaScript] 3가지의 언어만 읽을 수 있기 때문입니다. 그럼 SCSS/SASS로 이뤄진 파일은 반드시 컴파일을 해야 하는데 컴파일 하는 방법에 대해서 알아보겠습니다. SCSS 설치법 [수동 설치법] https://..