스타일시트는 내부 스타일시트, 인라인 스타일시트, 외부 스타일시트 방법으로 사용 할 수 있다.
1. 내부 스타일 시트
내부 스타일시트는 해당 문서의 <head>와 </head>사이에 선언합니다.
<style>태그로 선언하며 태그 사이에 스타일을 작성하면 됩니다.
스타일 작성 방법은 아래와 같습니다.
선택자{속성: 속성값;}
1개 이상의 속성과 속성값 사용도 가능합니다.
선택자{속성: 속성값; 속성: 속성값;}
<head>
<title>스타일시트 선언방법</title>
<style>
h1{font-size: 20px; font-weight: bold;}
</style>
</head>
2. 인라인 스타일 시트
인라인스타일시트는 html 태그에 스타일을 직접 지정하는 방법입니다.
단, <head>와 <title>에서는 사용할 수 없습니다.
스타일 작성 방법은 아래와 같습니다.
<태그 style = "속성:속성값;“> 문장 </태그>
인라인 스타일시트도 여러 속성과 속성값 사용이 가능합니다.
<태그 style = "속성:속성값; 속성:속성값;“> 문장 </태그>
<body>
<!--인라인 스타일시트-->
<h1 style="font-size: 20px; font-weight: bold;">인라인방식의 스타일시트입니다.</h1>
</body>
3. 외부 스타일 시트
외부 스타일시트는 별도 외부의 파일로 작성한 후 <link> 명령을 이용하여 선언하는 방법입니다.
스타일을 적용하고자 하는 html문서의 <head>에 아래와같이 선언 할 수 있습니다.
<link rel = "stylesheet" type = "text/css" href = "외부 스타일시트 경로“>
단, html5에서는 type = "text/css" 부분을 생략 하여 아래와 같이 작성 할 수 있습니다.
<link rel = "stylesheet" href = "외부 스타일시트 경로“>
<head>
<title>스타일시트 선언방법</title>
<!--외부 스타일시트 선언-->
<link rel="stylesheet" type="css/text" href="css/reset.css">
<link rel="stylesheet" href="css/reset.css">
</head>
