관리 메뉴

엉망진창

하이퍼 링크 글자 색 각각 다르게 하는 법 본문

Study_Web/Ajax

하이퍼 링크 글자 색 각각 다르게 하는 법

엉망진창 2007. 1. 3. 13:10

a.best:link {color:#777777;text-decoration:none}
a.best:visited {color:#777777;text-decoration:none}
a.best:active {color:#3a7cbf;text-decoration:none}
a.best:hover {color:#3a7cbf;text-decoration:none}

a.channel:link {color:#efefef;text-decoration:none}
a.channel:visited {color:#efefef;text-decoration:none}
a.channel:active {color:#777777;text-decoration:none}
a.channel:hover {color:#777777;text-decoration:none}

스타일 소스에 body 전체에 적용될 기본적인 스타일 소스외에 위와같이 class 이름을 적용하시고 소스를 구성하셔서 해당 링크 태그에 아래와같은 방식으로 각각의 class 이름을 적용하시면 됩니다

<a href="링크 경로" class="best" onfocus="this.blur()">글자</a>

<a href="링크 경로" class="channel" onfocus="this.blur()">글자</a>

링크된 글자에 생기는 밑줄은 text-decoration:none 으로 제어됩니다

링크된 글자나 이미지를 클릭시에 생기는 사각점선은  onfocus="this.blur()" 으로 제어됩니다

'Study_Web > Ajax' 카테고리의 다른 글

여러가지 툴팁 모음  (0) 2009.05.18
Ajax 마스터하기(한국 developerWorks)  (2) 2008.06.24
JS 이미지 효과 스타일  (0) 2007.04.28
링크에 무지개 효과  (1) 2007.03.13
background 이미지 고정  (0) 2007.02.22