두부두목

오늘의집 클론코딩 프로젝트 하면서 완전히 반응형은 아니더라도 약간의 타블렛, 모바일 환경은 고려하고 싶었다. 그와 관련해서 scss 에서 변수와 믹스인이라는 것을 알게 되었다. 🔡 변수(Variables) 앞부분에 $ 를 붙이면 변수를 선언하여 사용할 수 있다. $black: #000000; $font-default: 1.2rem; 아래와 같이 사용하면 된다. body { font-size: #{$font-default}; } 📼 믹스인(Mixins) 믹스인은 CSS 를 묶어서 재사용할 수 있는 모듈로 만들어 준다. @mixin card-view { font-size: 22px; border: 1px solid grey; border-radius: 4px; } 사용은 아래처럼. div { @include..

기본적으로 HTML 의 성질을 알아보자. ✅ HTML 의 특징 파악하기 블록 요소와 인라인 요소 웹 브라우저의 공간 유무와 상관없이 사용할 때마다 줄 바꿈되는 태그가 있다. 이러한 태그로 작성한 코드를 블록 요소(block element) 라고 한다. 이와 반대로 공간이 부족할 때만 줄 바꿈되는 태그가 있는데, 이런 태그로 작성한 코드를 인라인 요소(inline element) 라고 한다. 블록 요소 - div (공간 분할 태그) 코드를 작성하다 보면 구조를 더 깔끔하게 작성하여 쉽게 레이아웃을 구성하기 위해 관련 있는 요소를 그룹으로 묶어야 하는 경우가 많다. HTML 에서는 이런 그룹 짓기 작업을 div 태그와 span 태그로 수행한다. div 태그는 주로 블록 요소와 인라인 요소를 그룹으로 묶을 때..