가져온 스타일시트 CSS와 연결된 스타일시트 CSS의 차이점-CSS 튜토리얼-php.cn

가져온 스타일시트 CSS와 연결된 스타일시트 CSS의 차이점

高洛峰

풀어 주다： 2016-12-16 15:37:13

원래의

2511명이 탐색했습니다.

<span style="font-family:Arial;"><!-- 链接外部样式：也就是在与<head>与</head>标记之间加入一个<link>标记。 -->  
<head>  
<link href=”style.css” rel=”stylesheet” type=”text/css” />  
</head>  
<!-- 导入外部样式：在内部样式表的<style></style>标记之间导入一个外部样式表，导入时用@import。 -->  
<style type="text/css">  
 @import "CssStyle.css";  
</style></span>

로그인 후 복사

항상 구분을 못해서 좀 시간이 있을 때 살펴보았습니다

우선 무엇이 무엇인지 구별해 봅시다. 외부 링크 스타일 및 외부 스타일 가져오기:

외부 스타일을 참조하는 이 두 가지 방법은 모두 독립적인 CSS 스타일 파일을 웹 페이지 파일로 참조하지만 여전히 미묘한 차이가 있습니다. 둘 사이의 차이점(동일한 두 개를 만들 만큼 디자인이 지루하지 않기 때문에) 제가 배운 두 가지 측면을 바탕으로 토론해 보겠습니다.

1. 링크로 연결된 CSS는 다음과 같습니다. 클라이언트는 웹 페이지를 탐색하고 먼저 외부 CSS 파일을 웹 페이지에 로드한 다음 이를 컴파일하고 표시합니다. 따라서 이 경우 네트워크 속도가 느리더라도 표시된 웹 페이지는 예상한 것과 동일한 효과를 갖습니다. , 효과는 동일합니다. @import를 사용하여 가져온 CSS는 클라이언트가 웹페이지를 탐색할 때 먼저 html의 구조를 표시한 다음 외부 CSS 파일을 웹페이지에 로드합니다. 물론 최종 효과는 이전과 동일합니다. , 그러나 네트워크 속도가 느린 경우 CSS 통합 레이아웃이 없는 HTML 웹페이지가 먼저 표시되므로 독자는 매우 기분이 좋지 않을 것입니다. 이는 현재 대부분의 웹사이트의 CSS가 링크를 사용하는 주된 이유이기도 합니다.

2. 스타일을 가져오면 너무 많은 페이지가 하나의 CSS 파일을 가리키는 것을 방지할 수 있습니다. 웹사이트에 동일한 CSS 파일을 사용하는 페이지가 많지 않은 경우 두 방법의 효과는 거의 차이가 없습니다. 그러나 웹사이트의 페이지 수가 일정 수준에 도달하면(예: Sina 등의 포털) ), 링크 방식을 사용하기 어려울 수 있습니다. 이는 동일한 CSS 파일을 여러 페이지에서 호출하기 때문에 속도가 저하될 수 있지만 일반적으로 이 수준의 페이지에 도달할 수 있는 웹사이트는 최고의 하드 디스크를 사용할 수도 있습니다. , 따라서 이 요소에 대해 걱정할 필요가 없습니다.

위의 두 가지 요소를 바탕으로 이제 대부분의 웹사이트는 외부 CSS를 참조하기 위해 링크를 사용하는 것을 선호한다는 것을 알 수 있습니다.

가져온 스타일시트 CSS와 링크된 스타일시트 CSS의 차이점에 대한 더 많은 관련 기사를 보려면 PHP 중국어 웹사이트를 주목하세요!