CSS

CSS(Cascading Style Sheets) 는 HTML의 스타일(디자인)을 담당하는 언어입니다.

한마디로

HTML이 뼈대라면, CSS는 옷과 화장이에요.

예시

HTML만 있을 때

<h1>안녕하세요</h1>
<p>반갑습니다</p>

→ 그냥 검은 글씨, 밋밋한 모습

CSS 추가

h1 {
    color: blue;
    font-size: 32px;
}

p {
    color: gray;
    background-color: yellow;
    padding: 10px;
}

→ 색상, 크기, 배경 등 스타일 적용

역할 분리

언어역할비유
HTML구조/내용뼈대, 골격
CSS디자인/스타일옷, 화장, 인테리어
JavaScript동작/기능행동, 움직임

CSS 적용 방법 3가지

<!-- 1. 인라인 -->
<p style="color: red;">텍스트</p>

<!-- 2. 내부 스타일 -->
<style>
    p { color: red; }
</style>

<!-- 3. 외부 파일 (가장 권장) -->
<link rel="stylesheet" href="style.css">

"Cascading"의 의미

CSS에서 Cascading은 "위에서 아래로 흐르는" 뜻이에요. 여러 스타일이 충돌하면 우선순위에 따라 적용됩니다.

p { color: blue; }
p { color: red; }  /* 이게 적용됨 (나중에 선언) */

한줄 요약

CSS = 웹페이지를 예쁘게 꾸며주는 스타일 언어

CSLOG에서 보기