>  기사  >  웹 프론트엔드  >  CSS의 외부 스타일 시트란 무엇입니까?

CSS의 외부 스타일 시트란 무엇입니까?

青灯夜游
青灯夜游원래의
2020-11-13 16:37:286826검색

CSS에서 CSS 스타일이 웹 페이지 문서 외부의 파일에 배치되는 경우 이를 외부 스타일 시트라고 합니다. CSS 스타일 시트 문서는 CSS 외부 스타일 시트 파일을 ".CSS"로 사용합니다. 확장자 이름과 해당 파일의 위치에 대한 링크가 HTML 문서에 포함되어 웹 브라우저가 스타일을 찾을 위치를 알 수 있습니다.

CSS의 외부 스타일 시트란 무엇입니까?

【추천 튜토리얼: CSS 동영상 튜토리얼

웹 브라우저가 웹 페이지를 로드할 때 표시되는 방식은 CSS 스타일 시트의 정보에 따라 달라집니다. HTML 파일: 외부, 내부 및 인라인.

내부 및 내장 스타일시트는 HTML 파일 자체에 저장됩니다. 현재 작업하기는 쉽지만 중앙 위치에 저장되지 않기 때문에 전체 사이트에서 동시에 스타일을 쉽게 변경할 수는 없으며 각 항목으로 돌아가서 수동으로 변경해야 합니다.

CSS 스타일이 웹 페이지 문서 외부의 파일에 배치된 경우 이를 외부 스타일 시트라고 합니다. CSS 스타일 시트 문서는 외부 스타일 시트를 나타냅니다.

실제로 외부 스타일 시트는 확장자가 .css인 텍스트 파일입니다. CSS 스타일 코드를 텍스트 파일에 복사하여 .css 파일로 저장하면 외부 스타일 시트입니다.

아래와 같이 온라인 외부 스타일 시트(http://c.biancheng.net/templets/new/style/common.css)입니다.

CSS의 외부 스타일 시트란 무엇입니까?

css 외부 스타일 시트 파일은 .CSS 파일을 사용합니다. 확장명, 그리고 HTML 문서에는 웹 브라우저가 스타일 지침을 찾을 수 있는 위치를 알 수 있도록 이 파일의 위치에 대한 링크가 포함되어 있습니다.

하나 이상의 문서가 동일한 CSS 파일에 연결될 수 있으며, 웹사이트에는 다양한 페이지, 표, 이미지 등의 스타일을 지정하는 데 사용되는 고유한 CSS 파일이 많이 있을 수 있습니다.

CSS 외부 스타일시트에 어떻게 연결하나요?

특정 외부 스타일시트를 사용하려는 모든 웹페이지는 다음과 같이

섹션에 있는 CSS 파일에 연결해야 합니다.
<head>
<link rel =“stylesheet”type =“text / css”href =“styles.css”>
</head>

이 예에서 필요한 유일한 변경 사항은 직접 작동하도록 만드는 것입니다. 문서의 텍스트는 CSS 파일의 위치인 styles.css입니다.

파일 이름이 실제로 styles.css이고 파일에 연결된 문서와 정확히 동일한 폴더에 있는 경우 위에 읽은 내용과 동일하게 유지될 수 있습니다. 그러나 CSS 파일의 제목이 다른 것일 수 있으며, 이 경우 이름을 "스타일"에서 사용자 이름으로 간단히 변경할 수 있습니다.

CSS 파일이 이 폴더의 루트가 아닌 하위 폴더에 있는 경우 다음과 같이 읽을 수 있습니다.

<head>
<link rel =“stylesheet”type =“text / css”href =“styles \ menus \ black.css”>
</ head>

외부 CSS 파일에 대한 추가 정보

외부 스타일시트 가장 큰 이점은 묶여 있지 않다는 것입니다. 특정 페이지에 스타일이 내부적으로 또는 인라인으로 실행되는 경우 사이트의 다른 페이지는 이러한 스타일 기본 설정을 가리킬 수 없습니다.

그러나 외부 스타일을 사용하면 웹 사이트의 모든 페이지에 동일한 CSS 파일을 사용할 수 있으므로 모든 페이지가 통일된 모양을 가지며 전체 웹 사이트의 CSS 콘텐츠를 편집하는 것이 매우 쉽고 중앙 집중화됩니다.

아래에서 어떻게 작동하는지 볼 수 있습니다...

내부 스타일은 태그와 구별되어야 하기 때문에

<head>
<style>
body {
    background-color: green;
}
h1 {
    color: blue;
    margin-left: 15px;
} 
</style>
</head>

이 예에서 인라인 스타일은 제목 세부 사항에 포함되어 있기 때문에 해당 특정 페이지에만 적용됩니다. HTML 페이지의 두 번째 예에서는 CSS 정보가 CSS 파일에 자체적으로 포함되어 있으며 위의 외부 스타일 시트에 연결하는 방법 섹션에 있는 코드를 사용하여 모든 페이지에 연결할 수 있습니다.

더 많은 프로그래밍 관련 지식을 보려면

프로그래밍 학습 웹사이트

를 방문하세요! !

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

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