scss2 SCSS SCSS CSS는 많이 들어봤는데 SCSS는 생소하시죠...? 오늘은 이 생소한 친구에 대해 파헤쳐 볼건데요. 쉽게 생각해서 CSS를 좀더 편하게 쓰기 위한 녀석입니다. 이 언어는 Sass라는 언어와 자주 묶여서 설명이 나오는데요. 이 둘은 문법 생김새는 다르지만 사실 같은 파생언어라고 봐도 무방합니다. 그리고 Sass보다는 SCSS의 활용수, 사용자 수 가 많으므로 여기서는 SCSS를 다룰게요. ■ 개념 Sassy CSS란 뜻인데요. 이걸 풀이하자면 문법적으로 멋있는(Sassy) CSS란 뜻이에요. SCSS란 매우 쉽게 말하자면 CSS를 편리하게 사용할 수 있도록 하며 추가 기능 또한 있는 확장판 스크립트 언어에요. SCSS는 중첩, 변수 선언, 연산자 등 많은 장점이 있습니다. 그중에서도 가장 대표적.. 2022. 8. 18. 애니메이션 효과 움직이는 강아지 만들기 이번시간에는 CSS를 이용해서 움직이는 강아지 애니메이션를 만들어 보겠습니다.오늘 작업은 코드펜으로만 작업하였고 html소스는 Pug를 이용했고 CSS는 SCSS를 이용해서 작업했습니다. 강아지는 언제봐도 귀엽죠...💕 같이 만들어 봐요!!🐾 ■ 그래서... Pug가 뭔가요? Pug는 html을 조금 더 세련되게 쓸 수 있는 템플릿 언어, express 뷰 엔진입니다. 여기서 템플릿언어란 간단하게 설명하자면 자바스크립트를 사용해서 HTML을 렌더링할 수 있게 해주는 엔진에서 사용되는 언어입니다. ▶ 왜 쓰는거죠? ' 강아지 보고 가실게요' 이렇게 쓰는 것을 '.dog 강아지 보고 가실게요' 처럼 쓸 수 있습니다. 너무 편하죠?사실 어느 템플릿 언어를 사용해도 무방하나 이 Pug라는.. 2022. 8. 18. 이전 1 다음 반응형
