CSS 외부 링크를 작성하는 기본 방법은 무엇입니까?

쓰기: 1. "" 2. "".

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

외부 스타일 시트(외부 링크)를 브라우저에서 인식하고 구문 분석하려면 먼저 웹 문서로 가져와야 합니다. 외부 스타일 시트 파일은 두 가지 방법으로 HTML 문서로 가져올 수 있습니다.

1. 태그를 사용하여 가져오기

태그를 사용하여 외부 스타일 시트 파일을 가져옵니다.

<link type="text/css" rel="stylesheet" href="css文件地址"/>

각 속성 설명:

• href 속성은 주소를 설정합니다. 외부 스타일 시트 파일은 상대 주소 또는 절대 주소일 수 있습니다.

• rel 속성은 관련 문서를 정의하며, 여기서는 관련 스타일 시트를 의미합니다.

• type 속성은 스타일 요소와 마찬가지로 CSS 텍스트 파일을 나타냅니다.

일반적으로 태그를 정의할 때 3가지 기본 속성을 정의해야 하며, 그 중 href는 필수 속성입니다.

link 요소에 title 속성을 추가하여 선택적 스타일 시트의 제목을 설정할 수도 있습니다. 즉, 웹 문서에서 여러 스타일 시트를 가져올 때 title 속성 값을 통해 적용할 스타일 시트 파일을 선택할 수 있습니다. .

팁: Firefox 브라우저의 메뉴에서 "보기 --> 페이지 스타일" 옵션을 선택하면 제목 속성 값이 하위 메뉴에 표시됩니다. 다른 제목 속성 값만 선택하면 됩니다. 필수 스타일 시트 파일을 선택적으로 적용할 수 있습니다. IE 브라우저는 이 기능을 지원하지 않습니다.

또한 title 속성은 rel 속성과 관련되어 있습니다. W3C 조직의 계획에 따르면 향후 웹 문서에서는 여러 개의 요소를 사용하여 스타일 시트 파일, 스크립트 파일, 테마 파일은 물론 개인 사용자 정의를 위한 추가 보충 파일도 포함되어 있습니다. 다양한 유형과 이름의 파일을 너무 많이 가져온 후에는 title 속성을 사용하여 선택할 수 있습니다. 이때 rel 속성의 역할은 웹 페이지 파일이 처음 표시될 때 적용되는 가져온 파일 형식을 지정할 수 있습니다. 현재는 CSS 스타일 시트 유형에만 연결할 수 있습니다.

외부 스타일은 CSS 애플리케이션을 위한 최상의 솔루션입니다. 하나의 스타일 시트 파일은 여러 웹 페이지에서 참조할 수 있으며, 하나의 웹 페이지 파일은 링크 요소를 반복적으로 사용하여 여러 스타일 시트를 가져올 수 있습니다.

2. @import 키워드를 사용하여 가져오기

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

@import 키워드 뒤에 url() 함수를 사용하세요. 특정 외부 스타일 시트 파일의 주소를 포함합니다.

비교

스타일 시트를 가져오는 두 가지 방법 비교:

• link는 HTML 태그에 속하고 @import는 CSS에서 제공됩니다.

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

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

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

스타일 시트를 가져올 때 일반적으로 링크를 사용하는 것이 좋으며, @import를 보조 방법으로 사용할 수 있습니다.

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

위 내용은 CSS 외부 링크를 작성하는 기본 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!