14장 이미지 바꿔치기

[책] Web Standards Solutions 웹 표준 첫걸음
에 나오는 내용중 중요한 부분만 정리하였다. 저작권이 문제가 될지도 모르겠다.

아래와 같은
<h1 id="fir"> 테스트 </h1>
 이 있을때 텍스트 대신 이쁜 이미지를 사용하는 방법
1 FIR 엘리먼트 추가
 <h1 id="fir"><span> 테스트 </span></h1>
#fir {
     background: url(xxxxx.gif) no-repeat;
 }
 #fir span {
    display:none
 }
 형태로 글자를 안 보이게 함
2 LIR 마크업과 css
<h1 id="fir">테스트</h1>
#fir {
     background: url(xxxxx.gif) no-repeat;
     height : 0px !important;
    height /**/:90px /* IE5용
 }
 두가지 경우 다 이미지는 끄고 css는 켜는 접근성 문제
3 C 파크 방법
#fir {
    text-indent : -5000px;
    background : url(xxxx.gif) no-repeat;
}
4 sIFR 방법
 자바 스크립트와 플래쉬로 이쁘게 하는거, 여기에는 안 적을란다. 귀찮다.