■ html 파일에서 css 파일 import
html 파일의 <head>태그 안에 <link type=’text/css’ rel=’stylesheet’ href=’css 파일 경로’ />를 추가
■ 외부 CSS파일 예제(externalCss.css)
.Box01 { border: 1px double #7F9DB9; font-size: 32px; FONT-FAMILY: Arial,Helvetica,Tahoma,Verdana,sans-serif; COLOR: #006600; }
■ 외부 CSS파일을 포함하는 HTML 파일 예제
<!DOCTYPE html> <html ng-app="myApp"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta charset="utf-8"> <link rel="stylesheet" href="./externalCss.css"> <head> <title>외부 css 파일 include</title> </head> <body> <h1 class="Box01"> 외부 CSS 파일 include<br/> </h1> <hr/> </body> </html>
■ 외부 CSS파일을 포함하는 HTML 파일 실행결과
- CSS 처음과 마지막에 스타일 주기 2018년 2월 26일
- CSS 원하는 순서 및 홀수, 짝수에만 스타일 2018년 2월 26일
- 외부 css 파일 include 2015년 4월 5일