반응형
[광고 누르면 오늘의 행운 상승!!]
- 장점
- 여러 HTML 파일에 공통으로 사용
- 수정 시 HTML 파일을 전체 수정할 필요 없음
- 체계적으로 구조적인 스타일 관리 가능
- 전체 전송량이 줄어듬
- 외부 스타일 시트 파일 : .css를 가지는 파일, 텍스트로 이루어짐
- HTML에서 외부 CSS 파일의 연결
- HTML 코드 작성
- 비어있는 파일을 작성하고 확장자 .css 로 저장
- CSS 파일 경로 지정 (HTML 코드 <head>부분에 link요소 사용)
- CSS파일 열어 CSS스타일 지정
- link 요소 : HTML문서와 외부 리소스 연결을 위해 사용, 대부분 CSS파일 연결
- link 요소의 속성
| rel 속성 | 생략 불가한 속성 |
| 현재 HTML과 연결할 파일간의 관계 나타냄 | |
| 다양한값을 가짐 | |
| CSS파일 연결 : rel = "stylesheet" |
| href | 연결하고자하는 리소스 파일 경로 지정 |
- 하나의 HTML파일에 여러개의 link요소 사용하여 각기 다른 여러 CSS파일 링크 가능
예) <link rel = "stylesheet" href = "css/style.css">
<link rel = "stylesheet" href = "css/style.css" type = "text/css"media="all"> - CSS코드 내에서 외부 CSS파일을 불러오면 수정과 관리가 체계적이고 쉬워진다.
반응형
'5. 웹 프로그래밍 > 2. CSS' 카테고리의 다른 글
| 의사클래스[CSS] (0) | 2020.03.10 |
|---|---|
| 하위 선택자[CSS] (0) | 2020.03.10 |
| 타입 선택자[CSS] (0) | 2020.03.10 |
| HTML요소 속성으로 CSS 적용[CSS] (0) | 2020.03.10 |
| CSS란?[CSS] (0) | 2020.03.10 |