반응형


CSS는 CSS를 적용한 단순한 텍스트 파일을 작성한 것을 정의함으로서 사용가능하다.

CSS가 같이 적용된 사이트에 접속할 경우 페이지 변경이 일어나도 캐쉬되기 때문에 파일정보가 다시 전송되지 않는다.


다음예제를 보자

File : example.html

<html>
<head>
<title>MY CSS PAGE</title>
<link rel=stylesheet href="whatever.css" type="text/css">
</head>
<body>
<span class="headlines">Welcome</span><br>

<div class="sublines">
This is an example of a page using CSS.<br>
The example is really simple,<br>
and doesn't even look good,<br>
but it shows the technique.
</div>

<table border="2"><tr><td class="sublines">
As you can see:<br>
The styles even work on tables.
</td></tr></table>

<hr>

<div class="infotext">Example from EchoEcho.Com.</div>

<hr>
</body>
</html>


위의 예제는 전체 사이트에서 동일하게 CSS파일을 사용하며 한가지 중요한 예외사항은...
Style 문구가 페이지 상에 정의되지 않고 외부 Style Sheet 를 참조한다.

 <link rel=stylesheet href="whatever.css" type="text/css">

이것은  브라우져가 호출된 whatever.css 파일을 호출하고 HTML 문서상안에서 발견된 위치에 입력하는 것을 뜻한다.

File : whatever.css
.headlines, .sublines, infotext {font-face:arial; color:black; background:yellow; font-weight:bold;}
.headlines {font-size:14pt;}
.sublines {font-size:12pt;}
.infotext {font-size: 10pt;}


전체 사이트의 모든 <head>구문안에 <link rel=stylesheet href="whatever.css" type="text/css"> 를 추가함으로써 하나의 스타일을 통한 전체사이트를 적용하는 효과를 가질수 있다.

이글의 모든 내용을 www.echoecho.com 에서 참조하였을 밝힌다.
반응형
저작자표시

'Windows > css' 카테고리의 다른 글

Single PAGE (한 페이지 적용)  (0) 2010.09.06
단순 태그들  (0) 2010.09.06
선택자에 의존하는 문맥들  (0) 2010.09.06
그룹 선택자들  (0) 2010.09.06
ID 선택자들  (0) 2010.09.06

+ Recent posts

티스토리툴바