외부 CSS 스타일 시트를 도입하는 방법

외부 CSS 스타일 시트를 도입하는 방법: 1. "" 문을 사용하여 도입합니다. 2. 스타일 태그 쌍에서 "@import url("css file path");"을 사용하여 도입합니다.

이 튜토리얼의 운영 환경: Windows7 시스템, CSS3&&HTML5 버전, Dell G3 컴퓨터.

외부 CSS 스타일 시트를 도입하는 방법

1. 태그를 사용하세요.

태그는 문서와 외부 리소스 간의 관계를 정의합니다. 태그의 가장 일반적인 용도는 외부 CSS 스타일 시트에 연결하는 것입니다.

구문: ​​

<link rel="stylesheet" href="css文件路径" />

2. @import 규칙을 사용하세요

@import 규칙을 사용하면 스타일 시트를 다른 스타일 시트로 가져올 수 있습니다.

구문: ​​

<style type="text/css">
@import url("css文件路径");
</style>

과 @import 메소드

• link의 차이점은 HTML 태그에 속하지만 @import는 CSS에서 제공됩니다.

• 페이지가 로드되면 링크도 동시에 로드되며 @import에서 참조하는 CSS는 페이지가 로드될 때까지 기다린 후 로드됩니다.

• @import는 IE 5 이상에서만 인식 가능하며, 링크는 HTML 태그이므로 호환성 문제는 없습니다.

• link 스타일 스타일은 @import 가중치보다 가중치가 더 높습니다.

설명: 경로

상대 경로(Relative Path)

이름에서 알 수 있듯이 특정 참조 객체에 상대적인 CSS 파일의 위치입니다.

물리 수업을 들을 때 교사는 항상 상대 운동에 대해 언급합니다. 이는 고정된 참조 객체를 기준으로 객체가 다른 객체를 기준으로 움직이는 것을 의미합니다. 우리가 걸어가면서 차를 보면 차가 뒤로 가고 있는 것처럼 느껴지고, 차가 우리를 보면 앞으로 가고 있기 때문에 상대 경로도 이와 같이 보입니다. 물체.

다음과 같은 CSS 코드의 소개는 상대 경로 주소입니다. style.css 파일은 웹 페이지 파일과 동일한 디렉토리 수준에 있습니다.

<link rel="stylesheet" href="style.css" />

Absolute Path

절대적이므로 이 주소는 고유하고 독립적이라는 의미입니다. 로컬 영역 기준으로 현재 테스트 사이트의 절대 주소는 F:test 이며, 서버 기준으로는 127.0.0.1/test 와 같은 IP 주소가 되어야 합니다.

예:

<link rel="stylesheet" href="http://xxx.com/test/css/style.css" />

경로 소개에 대하여

Css 파일을 가져올 때 상대 경로인지 절대 경로인지 개인적으로 로컬에서 미리 볼 때 상대 경로를 선택하고 절대 경로로 변경할 수 있다고 생각합니다. 프로젝트가 온라인일 때 왜요?

1. 인덱싱을 줄입니다. 절대 주소의 고유성을 통해 사용자가 웹 페이지에 들어갈 때 브라우저가 IP 주소를 직접 인덱싱할 수 있으므로 지연이 발생하지 않습니다. 상대 경로는 디렉토리를 단계별로 색인화하는 것입니다. 이것은 마치 좋아하는 여자를 길에서 만나는 것과 같습니다. 우리는 그 사람과 직접 대면하기에는 너무 부끄러워서 용기를 내어 올라가기 전에 수많은 우연한 만남을 만듭니다. 연락처를 물어보니 그 여자는 이미 오래 전부터 유명세를 떨친 사람이었는데 애초에 왜 그랬을까~

2. SEO를 수행하는 사람들은 외부 링크가 다른 사람이 가져오더라도 무게가 상당히 증가할 수 있다는 것을 알고 있습니다. 자체 서버 주소로 변경되지 않은 경우 이는 참조 주소를 의미합니다. 이 웹사이트는 여전히 우리의 URL입니다. 크롤러는 이 이미지 참조 주소를 통해 다시 크롤링하지만 주소가 변경되었기 때문에 크롤러가 다시 크롤링하므로 해당 파일을 찾을 수 없습니다. 크롤러의 작업이 곧 중지됩니다.

3. 순위를 높이세요. HTML을 다운로드했지만 CSS를 직접 다운로드하고 싶지 않은 경우가 있을 것입니다. 로컬 주소로 직접 전화하세요. 이 페이지를 미리 볼 때 실수로 가져오기 주소를 클릭하면 해당 웹사이트 CSS로 이동합니다. 홈페이지를 방문하지 않더라도 해당 도메인 이름을 방문하므로 의도치 않게 방문 수가 늘어납니다.

(학습 영상 공유: css 영상 튜토리얼)

위 내용은 외부 CSS 스타일 시트를 도입하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!