| [ 스타일시트의 사용법 ]
HTML 문서에 CSS를 적용시키는 방법은 간편하게 <STYLE> 태그를 사용하는 내부지정 방법과 별도의 css파일을 만든 후 호출해서 사용하는 외부지정방식으로 나눌 수 있습니다.
문서의 내부에서 CSS를 사용하는 방법은 먼저 HEAD 영역에 정의해 놓고 BODY 영역에서 호출하여 사용하는 방법과 BODY 영역의 해당 태그에서 스타일을 정의해 부분적으로 스타일을 적용시키는 방법으로 다시 나눌 수 있습니다. HEAD 부분에서 지정하는 CSS는 문서 전체에 영향을 미치며, BODY 내부에서 지정하는 CSS는 해당위치에서만 효과를 발휘합니다.
▣ 외부파일로 저장하여 호출하는 경우
<HEAD>
<LINK rel="stylesheet" type="text/css" href="css파일명">
</HEAD> |
▣ HTML문서의 <HEAD> 태그에서 설정하는 경우
<HEAD>
<STYLE type="text/css">
<!--
선택자 {속성:값; 속성:값;}
//-->
</STYLE>
</HEAD> |
CSS 스타일을 지정할 때에 <STYLE> 태그에 주석 (<!-- //-->) 부호를 사용하는 이유는 CSS가 지원되지 않는 브라우저의 경우 스타일 지정내용이 텍스트로 그냥 출력되는 것을 방지하기 위해서입니다.
| ※ CSS의 주요 선택자와 의미 - BODY : 문서전체의 본문에 영향을 미침 (HTML의 <BODY> 와 같음)
- TABLE : 테이블 전체에 영향을 미침
- TR : 테이블의 줄 <TR> 태그에 속성을 추가함
- TD : 테이블 안의 텍스트와 요송에 영향을 미침
- DIV : 레이어에 관련된 설정
- A:link : 링크에 속성을 지정
- A:visited : 한번 클릭한 적이 있는 링크줄에 대한 설정
- A:hover : 마우스가 위치했을 때의 링크의 설정
|
| 
0 분
8 분
