웹제작 강의/HTML

HTML 18강 CSS 응용하기

vonzone 2009. 4. 23. 23:31
오늘은 CSS 마지막 시간으로 지금까지 배운 CSS 사용법을 응용해서 사용해보도록 하겠씁니다.

마지막에 하이퍼 링크 CSS파일은 두고두고 사용하시면 편리하시 거에요.^^

 




<class 사용하기>




html18-1 from Lee Jun Ho on Vimeo.

 







<class 사용하기>

1) head에서 class 정의하기

<head>
<style type=text/css>
<!--
td
{
font-size : 10pt;
font-family : 휴먼매직체;
}
td.ttd     <!-- .을 찍고 이름을 쓴다.-->
{
font-size : 13pt;
font-family : 휴먼매직체;
color: #003366;
}
.lcc     <!-- .을 찍고 이름을 쓴다.-->
{
font-size : 11pt;
font-family : 고딕체;
color: #003366;
}
-->
</style>
</head>

2) class 사용하기

<td bgcolor=#33FFFF class="ttd"> 글자 </td>
<div align=right class="lcc"> 이준호 Internet Media LCC</div>
<span class="lcc"> 이준호 Internet Media LCC</span>


<하이퍼 링크 CSS 설정>

a:link   <!--페이지 처음 열렸을 때 보이는 링크 텍스트 상태-->
{
color: #99cc00;
text-decoration : none;
}
a:visited  <!--링크 사이트를 한번 이라도 방문했을 경우 나타나는 상태-->
{
color: #000000;
text-decoration : none;
}


a:hover   <!--마우스가  링크 텍스트 위로 올라갔을 때 상태-->
{
color: #ff0000;
text-decoration : underline;
background-color : #ffccff;
}