CSS 소개

강의 1: CSS 소개

"Basic to Brilliance"의 첫 번째 강의에 오신 것을 환영합니다. CSS를 마스터하기 위한 여정은 여기에서 시작됩니다!

---

CSS란 무엇인가요?

CSS(Cascading Style Sheets)는 웹페이지 표시를 설명하는 데 사용되는 언어입니다. HTML이 구조와 내용을 제공하는 반면, CSS는 웹 페이지를 매력적이고 사용자 친화적으로 보이게 만드는 역할을 합니다. 레이아웃, 색상, 글꼴, 간격 등을 제어합니다.

CSS가 왜 중요한가요?

• 관심사항 분리: CSS를 사용하면 콘텐츠(HTML)를 프레젠테이션(CSS)에서 분리하여 코드를 더욱 깔끔하고 유지 관리하기 쉽게 만들 수 있습니다.
• 일관성: 단일 CSS 파일을 연결하여 여러 웹페이지에 일관된 스타일을 적용할 수 있습니다.
• 반응형 디자인: CSS는 데스크톱에서 스마트폰까지 모든 기기에서 보기 좋게 표시되는 웹사이트를 만드는 데 필수적입니다.

기본 CSS 구문

CSS는 HTML 요소를 대상으로 하는 규칙으로 구성됩니다. 각 규칙은 선택기와 선언 블록으로 구성됩니다.

selector {
  property: value;
}

• 선택기: 스타일을 지정하려는 HTML 요소를 대상으로 합니다.
• 속성: 변경하려는 요소의 측면(예: 색상, 글꼴 크기)
• 값: 속성에 적용하려는 특정 값입니다.

예:

모든

요소를 파란색으로 변경합니다.

HTML:

<h1>Hello, World!</h1>

CSS:

h1 {
  color: blue;
}

이 간단한 규칙은 모든

요소를 파란색으로 변경합니다.

HTML에 CSS 추가

HTML 문서에 CSS를 추가하는 세 가지 주요 방법은 다음과 같습니다.

1. 인라인 CSS: HTML 요소에 직접.

   <h1 style="color: blue;">Hello, World!</h1>

1. 내부 CSS: