스타일 시트를 읽으면 브라우저는 이에 따라 HTML 문서의 형식을 지정합니다.
스타일 시트 삽입 방법
스타일 시트를 삽입하는 방법에는 세 가지가 있습니다.
외부 스타일 시트
내부 스타일 시트
인라인 스타일
외부 스타일 시트
외부 스타일 시트는 스타일을 여러 페이지에 적용해야 할 때 이상적입니다. 외부 스타일 시트를 사용하면 파일 하나를 변경하여 전체 사이트의 모양을 변경할 수 있습니다. 각 페이지는 태그를 사용하여 스타일 시트에 연결됩니다. 태그는 문서의 헤드에 있습니다.
<head> <link rel="stylesheet" type="text/css" href="mystyle.css"> </head>
브라우저는 mystyle.css 파일에서 스타일 선언을 읽고 이에 따라 문서 형식을 지정합니다.
외부 스타일 시트는 모든 텍스트 편집기에서 편집할 수 있습니다. 파일에는 html 태그가 포함될 수 없습니다. 스타일 시트는 .css 확장자로 저장해야 합니다. 다음은 스타일시트 파일의 예입니다.
hr {color:sienna;}
p {margin-left:20px;}
body {background-image:url("/images/back40.gif");}속성 값과 단위 사이에 공백을 두지 마십시오. "margin-left: 20px" 대신 "margin-left: 20px"를 사용하면 IE 6에서만 작동하고 Mozilla/Firefox 또는 Netscape에서는 작동하지 않습니다.
내부 스타일 시트
단일 문서에 특별한 스타일이 필요한 경우 내부 스타일 시트를 사용해야 합니다. 다음과 같이