HTML 앵커가 무엇인지에 대한 자세한 설명
- PHPz원래의
- 2017-04-02 09:24:302623검색
웹 지식 학습의 첫 번째 단계는 역시 HTML입니다.
간단하게 말하면, 아주 긴 글을 세그먼트별로 정확하게 읽고 싶을 때 앵커 포인트를 활용하면 됩니다.
코드:
<a href="#001">跳到001</a> …文字省略 <a name="001" id="001" ></a> …文字省略
사실 앵커 포인트에는 이름만 있으면 됩니다.
href 값은 이름과 일치해야 합니다. i d , 앞에 "#"이 와야 합니다. 위 코드는 ie6/7, ff에서는 호환되지만 ie8에서는 호환되지 않습니다.
앵커 포인트의 값이 비어 있으므로 미관에 영향을 주지 않도록 공백을 추가하면 됩니다.
다음 코드는 호환됩니다. ie8
<a href="#001">跳到001</a> …文字省略 <a name="001" id="001" > & n b s p </a> …文字省略
또 다른 질문입니다. 특정 페이지의 특정 앵커 콘텐츠(예: 321.html)를 표시하시겠습니까?
코드는 다음과 같습니다
<a href="123.html#001">跳到001</a> …文字省略 <a name="001" id="001" > & n b s p </a> …文字省略
전체 코드 표시:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>锚点示例</title> </head> <body> <a name="A0" id="A0"></a> <a href="#A1">网页第一部分</a> <a href="#A2">网页第二部分</a> <div style="height:900px; background:#CCCCCC"></div> <a name="A1" id="A1"></a>1<a href="#A0">返回顶部</a> <div style="height:900px; background:#999999"></div> <a name="A2" id="A2"></a>2<a href="#A0">返回顶部</a> <div style="height:900px; background:#666666"></div> </body> </html>
위 내용은 HTML 앵커가 무엇인지에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.