씨.쉽.설 : CSS 쉽게 설명드립니다
안녕하세요, 그디(그래픽 디자이너) 마롱마롱 입니다.
오늘부터 "씨.쉽.설(CSS 쉽게 설명드립니다)"라는 이름으로 짬짬이 CSS에 대한 포스팅을 업로드해보려 합니다. CSS 기초를 배우시거나 관련 검색으로 들어오신 분들께 도움이 되었으면 좋겠네요!
CSS(씨에스에스)란?
CSS란 Cascading Style Sheet의 약자로 HTML, XHML, XML 같은 문서의 스타일을 꾸밀 때 사용하는 스타일 시트 언어입니다. 파일명은 style.css 입니다.
| * W3C(World Wide Web Consortium)에서 개발 * 발표일 : 1996년 12월 17일 |
- W3C(World Wide Web Consortium) : 월드 와이드 웹을 위한 표준을 개발하고 장려하는 조직
CSS는 HTML로 부터 디자인적인 요소를 분리해 사용하기 위한 용도로 개발되어졌습니다.
오래전에는 HTML 자체에서 간단한 디자인 요소를 작업을 했지만 작업량이 많아짐에 따라 문제점이 하나씩 드러나게 됩니다. 예를 들어 코드가 너무 길어지기에 눈으로 봤을 때 복잡해 보이는 것도 있었고, 그동안 작업했던 여러 페이지에 내가 타이틀 폰트나 사이즈를 수정하고 싶은데 그걸 동시 다발로 한 번에 수정을 할 수 없고 페이지마다 일일이 수정을 해야 했기 때문이죠.
CSS를 사용하는 이유, 장점
1. 정리가 잘된 CSS는 여러 웹페이지에 적용을 할 수 있기 때문에 작업 속도와 능률을 높입니다.
2. 하나의 웹 사이트를 접속하는 디스플레이(PC, 스마트폰, 태블릿 등)의 화면 크기에 따라 레이아웃이나 디자인이 보기 좋게 변하도록 만드는 반응형 웹디자인(Responsive Web Design)을 구현 할 수 있습니다.
3. CSS 자체 또는 자바스크립트와 연계하여 동적인 콘텐츠 표현을 할 수 있습니다. 오래전에 사용했던 플래시(Adobe Flash)의 기능을 대신하고 있는데, 플래시보다 훨씬 가볍고 작업 시간도 많이 줄어들었습니다.
HTML과 CSS 뭐가 다르지?
HTML과 CSS에 대해서 헷갈려 하시는 분들을 위해 간략하게 건물에 빗대어 설명을 하자면 HTML은 마감재를 쓰지 않은 건물의 레이아웃이나 골격이고 CSS는 세부 인테리어라고 생각하시면 됩니다.
| * HTML = 건축 골격, 뼈대 * CSS = 인테리어, 마감재, 스타일 |
HTML만으로도 홈페이지를 만들 수 있다고 할 수는 있겠지만, 건물 구조만 지은 공사 현장 정도의 느낌일 거예요. 그리고 건물 없이는 인테리어를 할 수 없듯이 CSS는 단독으로 사용이 불가능합니다.
CSS 누가 써먹나?
웹디자이너, 웹퍼블리셔들이 주로 CSS를 사용을 하고 그 외 프로그래머나 전문가가 아니더라도 워드프레스, 티스토리, 네이버, 텀블러 같은 블로그 디자인을 변경하고 싶으신 분들도 일부 CSS를 배워서 사용하기도 합니다.
이번 시간에는 간단히
CSS란 무엇인가에 대해
알아보았습니다.
그럼 다음시간에도 심플한
씨.쉽.설 포스팅으로 다시 뵐게요,
뿅!!
댓글