CSS 파일을 인용하는 방법: 1. "" 문을 사용합니다. 스타일 태그 url("css 파일 경로");" 명령문.
이 튜토리얼의 운영 환경: Windows7 시스템, CSS3&&HTML5 버전, Dell G3 컴퓨터.
CSS 코드는 .css 확장자를 가진 스타일 시트에 저장됩니다.
HTML 파일은 .css 확장자를 가진 스타일 시트를 참조합니다(외부 CSS).
문법:
1. 링크 유형
<link type="text/css" rel="styleSheet" href="CSS文件路径" />
2. 가져오기 유형
<style type="text/css">
@import url("css文件路径");
</style>예:
<!DOCTYPE>
<html>
<head>
<meta charset="utf-8" />
<title>外部样式表</title>
<!--链接式:推荐使用-->
<link rel="stylesheet" type="text/css" href="css/style.css" />
<!--导入式-->
<style type="text/css">
@import url("css/style.css");
</style>
</head>
<body>
<ol>
<li>1111</li>
<li>2222</li>
</ol>
</html>링크 유형과 가져오기 유형의 차이점
1에 속합니다. XHTML
2. 페이지
@import
1에 CSS 파일을 우선적으로 로드합니다. CSS2.1
2에 속합니다. HTML 구조를 먼저 로드한 다음 CSS 파일을 로드합니다.
외부 CSS의 장점:
1. HTML 페이지의 크기가 더 작고 구조가 더 명확합니다.
2. 로딩 속도가 빨라졌습니다.
3. 동일한 .css 파일을 여러 페이지에서 사용할 수 있습니다.
외부 CSS의 단점:
1. 외부 CSS가 로드되기 전에는 페이지가 올바르게 렌더링되지 않을 수 있습니다.
학습 동영상 공유: css 동영상 튜토리얼, html 동영상 튜토리얼
위 내용은 HTML에서 CSS 파일을 참조하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
