2020년 말, 대규모 프로젝트를 진행 중에 블로그를 시작해서 그런가 포스팅을 하지도 못하고, 나도 내 자신이 블로그를 시작했단 걸 깜빡했었다.
거두절미하고,
오늘은 Mark up Language의 CSS를 포스팅하려고 한다.
CSS란?
CSS란, Cascading Style Sheet의 약자로,
작년 8월에 포스팅했던 HTML(ㅋㅋㅋ)에 디자인적 구조를 입혀주는 마크업 언어다.
쉽게 말해, 집의 뼈대가 HTML이라면 집을 예쁘게 꾸미는 것이 CSS다.
웹 개발자는 크게 두 분류로 나뉜다.
프론트엔드(Front-End)와 백엔드(Back-End)
프론트엔드에서도 여러 분류로 또 나뉘는데,
마크업 언어는 보통 퍼블리셔(Publisher)에 해당한다.
하지만, 프론트엔드도 마크업 언어는 알아야하기 때문에 기초만 작성할 생각이다.
CSS 사용법
CSS 사용법은 간단하다.
HTML 태그 속성에 class또는 id를 지정한다.
예를 들어,
<div class="color-red">Hello, World!!</div>라고 지정하고 CSS파일에서는,
.color-red { color: red; }라 작성한다.
이렇게하면 결과는 Hello, world!! 가 된다.
HTML div 태그에 네이밍이 color-red인 class를 지정하고,
class color-red에 color: red;를 작성했다.
class & id
class란, 태그의 선택자이다. 하나의 태그에 레이아웃과 속성, 그리고 다양한 디자인을 작성하기 위해선
class에 작성하는 편이 좋다.사용법은 class네임 앞에 '.'을 붙이고 속성을 작성하면 끝이다.
id또한 태그의 선택자이다. id네임 앞에 '#'을 붙여 속성을 작성한다.
선택자라는 말이 다소 생소할 것이라 생각되어 다음은 선택자에 대해 포스팅하겠다.