>웹 프론트엔드 >프런트엔드 Q&A >HTML을 CSS에 연결하는 방법

HTML을 CSS에 연결하는 방법

王林
王林원래의
2023-05-05 14:30:4710703검색

웹 디자인에서 스타일 시트는 웹 페이지를 더욱 아름답고 읽기 쉽게 만드는 매우 중요한 부분입니다. HTML은 외부 스타일 시트에 연결할 수 있으며 가장 일반적으로 사용되는 스타일 시트는 CSS입니다. 이번 글에서는 HTML이 CSS에 어떻게 연결되는지 소개하겠습니다.

1. CSS란 무엇인가요?

CSS(Cascading Style Sheets)는 HTML이나 XML과 같은 문서의 모양 스타일을 설명하는 데 사용되는 마크업 언어입니다. CSS는 글꼴, 색상, 배경, 레이아웃 등을 제어하여 웹 페이지의 모양과 형식을 콘텐츠에서 분리할 수 있습니다.

2. HTML에서 CSS 연결

HTML에서 CSS를 사용하려면 태그에 요소를 추가해야 합니다. 이 요소는 외부 CSS 파일에 연결하는 데 사용됩니다. 요소에서는 CSS 파일의 위치, 파일 이름, 미디어 유형을 지정할 수 있습니다. 예는 다음과 같습니다.

<head>
  <link rel="stylesheet" type="text/css" href="styles.css">
</head>

이 예에서는 현재 웹페이지의 디렉토리에 있는 요소를 통해 CSS 파일 이름을 "styles.css"로 지정합니다. 이 CSS 파일에는 페이지에 적용하려는 스타일이 포함되어 있습니다.

브라우저가 HTML을 구문 분석할 때 자동으로 CSS 파일을 다운로드하고 그 안의 스타일을 HTML에 적용합니다.

3. 내부 CSS 스타일 시트

외부 CSS 파일을 연결하는 것 외에도 태그에