CSS3 (2) 썸네일형 리스트형 CSS 변수 선언하기 필자가 햇병아리 시절, CSS를 사용하며 많은 불편함을 느꼈던 것 중 하나는 색상 값을 #FFFFFF 혹은 rgb(255,255,255) 처럼 16진수나 RGB 값으로 입력해줘야 했던 것이다. 웹 퍼블리싱을 하다보면 색상 값을 잊어먹을 때가 종종 있다. 물론 LESS나 SASS(SCSS) (이하 전처리기)를 쓰게 되면서 이 부분은 해소되었지만 설정을 해야 하는 불편함도 있고, 전처리기를 사용하지 않으면 변수를 어떻게 선언할지 모르는 문제가 있었다. 왜 색상 값을 그냥 쓰지 않고 변수에 집착할까? .text { color:#000000; } .text { color:black; } 위 코드를 보았을 때, 어느 색상 값이 더 외우기 편한가? 개인마다 편차는 있겠지만 대부분 단어로 된 경우가 더 외우기 쉬울 .. CSS 작성 시 유의사항 CSS를 작성하기 시작하면, 본격적으로 웹페이지를 만들기 시작하는 웹 퍼블리셔의 첫 걸음을 뗐다고 볼 수 있다. CSS에 대한 사용법과 노하우 등을 소개하기 전에 CSS 작성 시 지켜야할 가이드라인이 있는데 그 부분을 먼저 소개한다. HTML과 마찬가지로 룰을 정해두고 지키는 것이 좋으며, 내가 작성한 CSS를 남들이 봤을 때도 알아보기 쉽도록 작성하는게 가장 좋다. SMACSS, BEM, OOCSS처럼 CSS를 작성하는 방법론이 있는데 이 부분은 다음에 다뤄보도록 하겠다. 1. 문법 (Syntax) /* Bad CSS */ .selector, .selector-secondary, .selector[type=text] { padding:15px; margin:0px 0px 15px; background-.. 이전 1 다음
