named anchor 사용하기.

dev | 2004-02-21

링크를 걸때 uri 뒤에 #name 을 붙이면...예를 들어...<pre class="code">/category1/section1.html#subtitle2</pre>이런 식으로요...그러면 해당 문서의 &lt;a name="subtitle2"&gt;&lt;/a&gt; 이 있는 부분으로 가지요? 그런데 이것보다 더 좋은 방법을 발견했습니다. id 속성을 많이 사용하지는 않는데 이 id 속성의 기능중의 하나가 named anchor 기능입니다. id 는 보통 CSS # selector 나 DOM 의 getElementById 에서 썼는데... 위와 같이 사용하지 않고..<pre class="code">&lt;table id="subtitle2"&gt;</pre>와 같이 사용을해도<pre class="code">&lt;a name="subtitle2"&gt;&lt;/a&gt;</pre>를 사용한 것과 같은 효과를 볼 수 있습니다. 어차피 id 라는 것이 화면상의 한 object 를 지칭하는 것이니까 named anchor 를 사용 할때에는 &lt;a&gt;&lt;/a&gt; 라는 것을 하나 더 추가 하는 것 보다도 table 이나 div 에 id 를 주는 것이 좋을 것 같습니다. 이렇게 하면 CSS 나 jScript 에서도 참조 할 수 있고... 참 좋은 것 같습니다. ^^ 단 화면에 겹치는 id 가 있으면 안되겠지요... 추가로...CSS3 스펙에 :target 기능이 추가 됐는데 이것은 위와 같은 named anchor 를 사용할때 나타나는 슈도엘리먼드입니다. named anchor 를 사용해도 문서의 마지막 부분을 가리키고 있으면 아래에 내용이 없기 때문에 화면 중간에 걸치게 되는데 :target 을 사용하면 이 부분을 다른 디자인으로 변경 할 수 있습니다. 단, 아직 IE6 에서는 지원이 되지 않고요. Mozilla 나 FireFox 를 사용하면 테스트 해 볼 수 있습니다. CSS 는 정말 대단한거 같아요....^^

Comments

    Post a comment

    :

    : 공개 되지 않습니다. Gravatar를 표시 합니다.

    :

    : HTML 태그를 사용할 수 없습니다.