>  기사  >  웹 프론트엔드  >  CSS에서 link와 @import의 차이점에 대한 자세한 설명

CSS에서 link와 @import의 차이점에 대한 자세한 설명

高洛峰
高洛峰원래의
2017-03-04 10:12:471252검색

link와 @import 모두 CSS 스타일 시트를 도입할 수 있다는 것을 모두 알고 있는데, 둘 사이의 차이점은 무엇인가요? 각각의 연결방식을 먼저 이야기한 후, 차이점에 대해 이야기해볼까요~~~


연결방식 :

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

@ Import import 방법:

<style type="text/css">   
 @import url(&#39;index.css&#39;);   
 </style>

우선순위: 스타일 삽입> 내부 스타일 시트> 스타일 시트 가져오기(스타일 시트에 링크)

가져오기 방법 및 체인 가져오는 방식이 매우 비슷하지만 실제로는 내부 스타일시트에 있는 것과 동일합니다. 그럼에도 불구하고 여전히 내부 스타일시트보다 우선순위가 낮으며, 링크된 스타일시트와의 비교 우선순위는 위치에 따라 다릅니다. 나중에 정의되면 우선순위가 더 높아집니다.

참고: 외부 스타일 시트를 가져올 때 해당 위치는 스타일 시트 상단, 즉 다른 스타일 앞에 있어야 합니다.

(제가 아는 한) 총 5가지 차이점이 있습니다. 앞으로 새로운 발견이 있으면 추가하겠습니다.

1: 링크는 CSS를 로드하는 것 외에도 RSS와 같은 다른 트랜잭션을 정의할 수 있으며 CSS 카테고리에 속하며 CSS만 로드할 수 있습니다.

둘: 링크가 CSS를 참조하면 페이지가 로드되는 동시에 로드됩니다. @import는 페이지가 완전히 로드될 때까지 기다려야 로드됩니다.

세 번째: 링크는 XHTML 태그이며 @import에 대한 호환성 문제가 없으며 하위 버전 브라우저에서는 이를 지원하지 않습니다.

넷째: 링크는 자바스크립트를 사용하여 DOM을 제어하여 스타일을 변경하도록 지원합니다. @import는 지원하지 않습니다.

5: @import는 CSS 파일에 다른 스타일 시트를 다시 도입할 수 있습니다.

위는 편집자가 소개한 CSS의 link와 @import의 차이점입니다. 궁금한 사항이 있으면 메시지를 남겨주시면 편집자가 답변해 드리겠습니다. 시간에. 또한 PHP 중국어 웹사이트를 지원해 주신 모든 분들께 감사드립니다!

CSS에서 link와 @import의 차이점에 대한 자세한 설명은 PHP 중국어 홈페이지를 참고해주세요!

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