onfocus='this.yellow()' 이 이벤트 설정은 잘못된 설정입니다.
마우스를 링크글자에 올리면 글자색을 바꾸려면 onmouseover 란 자바스크립트 이벤트 핸들러를 사용합니다.
예시 1) 마우스 오버시 글자색상을 바꾸려면 : onmouseover="this.style.color='색상'"
- 노란색으로 하려면 onmouseover="this.style.color='yellow'" 이렇게 설정해 주면 되겠지요....
예시 2) 마우스 오버 후 마우스를 비켜나면 다시 다른색이나 원래 색상으로 돌아오도록 하려면
onmouseout="this.style.color='색상'"
따라서 위의 스크립트 스타일을 적용하고자 하는 태그요소 (font,a,div 태그등) 에 정의해 줍니다.
예시 1)
<font onmouseover="this.style.color='색상'" onmouseout="this.style.color='색상'"> 텍스트 롤오버 </font>
예시 2)
<a href="" target="new" onmouseover="this.style.color='색상'" onmouseout="this.style.color='색상'"> 텍스트 롤오버 </a>
또는
<a href="" target="new"> <font onmouseover="this.style.color='색상'" onmouseout="this.style.color='색상'"> 텍스트 롤오버 </font> </a>
예시 3)
<div style="font-size:9pt;" onmouseover="this.style.color='색상'" onmouseout="this.style.color='색상'"> 텍스트 롤오버 </div>
예시 4)
그냥 일반적인 링크요소에 폰트태그만으로 색상을 바꾸려면
<a href="" target="new"> <font color=red> A 태그내에서 폰트태그로 색상 바꾸기</font> </a>
이와같이 정의해 주면됩니다.
위와 같이 해당 태그요소마다 정의해 줄 수도 있고 단순히 스타일만으로
페이지 전체 해당 태그 부분에 적용시켜 줄 수도 있습니다.
-- 스타일 예시 (1)
<style>
<!--
a:link { font-size:9pt; color:blue; }
a:visit { font-size:9pt; color:red; }
a:hover { font-size:9pt; color:orange; }
//-->
</style>
이렇게 스타일을 정의해 놓으면 페이지 전체 A 태그(링크)에 적용이 되며 A 태그마다 일일이 스타일을
정의해 주지 않고 그냥 기본적인 A 태그만으로 설정해 주면 됩니다.
또는 특정한 태그에만 스타일을 적용시켜 주는 방법도 있는데
스타일에 정의하는 방법은 "태그.변수명 { 속성 }" 이렇게 정의해 주고
해당 태그에 스타일을 적용하고자 할 때에는 <태그 class="변수명"> 이런씩으로
정의한 스타일을 호출시켜주면 됩니다.
예시)
A 태그에 적용하고자 한다면 "A.변수명 { 속성 }" 이런씩으로 정의해 주고
적용하고자 하는 A 태그는 <a class="변수명" href=""> 링크 </a> 이렇게...
※ 변수명은 임의로 설정하시면 되고 영문자로 정의해 줍니다.
아래 스타일 예문을 보세요.......
-- 스타일 예시 (2)
<style>
<!--
a:link { font-size:9pt; color:blue; }
a:visit { font-size:9pt; color:red; }
a:hover { font-size:9pt; color:orange; }
a.irp:hover { font-size:9pt; color:blue; background-color:yellow; }
//-->
</style>
이렇게 정의했을 때
<a href="" target="new"> 링크 1 </a>
<a class="irp" href="" target="new"> 링크 2 </a>
이렇게 a 태그에 적용했다면
첫번째 링크는 위 스타일(2)에 정의한 스타일이 적용이 되는 것이고
두번째 링크는 irp 란 클래스를 지정해 주었으므로
a.irp:hover { font-size:9pt; color:blue; background-color:yellow; }
이 스타일이 적용이 되는 것입니다.
위의 모든 내용들은 [HTML 길라잡이] 스타일 부분 : 27,28,36,37목록에 모두 있는
내용입니다.
카페 게시글
?? 태그 Q & A
<font color=red>답변
Re:글의 색상이 빠뀌지가 않아요
운영자
추천 0
조회 25
04.04.24 16:36
댓글 0
북마크
번역하기
공유하기
기능 더보기
다음검색