HTML에서 CSS를 호출하는 방법-프런트엔드 Q&A-php.cn

집

웹 프론트엔드

프런트엔드 Q&A

HTML에서 CSS를 호출하는 방법

王林

May 05, 2023 pm 07:58 PM

HTML이 CSS를 호출하는 방법

CSS(Cascading Style Sheet)는 HTML 페이지의 스타일을 제어하는 데 사용되는 언어입니다. CSS를 통해 HTML 구성 요소의 글꼴, 색상, 배경, 크기, 위치 등을 변경할 수 있습니다. HTML에서 CSS를 호출하는 방법은 여러 가지가 있으며, 이 기사에서는 두 가지 방법을 소개합니다.

방법 1: 인라인 스타일 시트

인라인 스타일 시트는 HTML 코드에 스타일을 정의하는 것을 의미합니다. 스타일은 HTML 태그의 "style" 속성을 사용하여 지정됩니다. 예:

<p style="color:blue;">这是一段蓝色文字</p>

로그인 후 복사

위 예에서는 인라인 스타일 시트를 사용하여 단락 구성 요소의 텍스트 색상을 파란색으로 지정했습니다. 스타일 변경 횟수가 적은 경우 인라인 스타일 시트가 더 나은 선택이지만, 여러 구성 요소의 스타일을 수정해야 하는 경우 인라인 스타일 시트를 사용하면 코드 유지 관리가 어려워집니다.

방법 2: 외부 스타일 시트

외부 스타일 시트는 CSS 코드를 별도의 CSS 파일에 저장한 후 HTML을 통해 호출합니다. 이 방법의 장점은 전체 웹사이트의 스타일을 하나의 CSS 파일로 관리할 수 있다는 것입니다. 먼저 CSS 파일을 생성하여 서버에 저장한 후 파일명을 "Example.css"로 설정합니다.

HTML에서는 헤드의 태그를 사용하여 CSS 파일을 소개합니다. 예:

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" type="text/css" href="样式文件的路径">
</head>
<body>
    <h1>这是一个标题</h1>
    <p>这是一段文本</p>
</body>
</html>

로그인 후 복사

위의 예에서는 스타일 파일을 소개하기 위해 헤더에 태그를 사용했으며 매개변수 유형은 "text/css"여야 합니다. rel 매개변수는 "stylesheet"로 설정되어야 하며 이는 이것이 스타일시트임을 나타냅니다. href 매개변수는 서버에 저장하는 스타일 파일의 경로여야 합니다. 이런 방식으로 HTML 페이지 전체에서 예제 .css 파일의 스타일을 사용할 수 있습니다.

요약

위는 HTML에서 CSS를 호출하는 두 가지 방법입니다. 인라인 스타일시트와 외부 스타일시트를 통해 HTML 페이지의 스타일을 변경하고 코드를 더욱 간결하고 읽기 쉽게 만들 수 있습니다. 외부 스타일시트를 사용할 경우 HTML에서 정상적으로 호출될 수 있도록 파일경로 설정과 파일명 정의에 주의해야 한다.

위 내용은 HTML에서 CSS를 호출하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

본 웹사이트의 성명

본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.