> 일일 프로그램 > HTML 지식 > HTML에 하이퍼링크와 앵커를 추가하는 방법과 기능에 대한 자세한 설명(동영상 첨부)

HTML에 하이퍼링크와 앵커를 추가하는 방법과 기능에 대한 자세한 설명(동영상 첨부)

藏色散人
풀어 주다: 2018-09-11 16:15:20
원래의
8470명이 탐색했습니다.

이 글에서는 주로 HTML의 하이퍼링크 앵커 설정을 추가하는 방법과 그 기능에 대해 소개합니다.

HTML 하이퍼링크 및 앵커 포인트 대부분의 친구들은 이미 개념을 매우 잘 알고 있다고 생각하지만, HTML을 이제 막 시작하는 초보자에게는 #🎜 🎜#How html에 하이퍼링크 앵커 포인트를 추가하는 것이 여전히 약간 불분명할 수 있습니다. 그래서 이 글은 초보 친구들을 위한 글이고, 필요하신 분들에게 도움이 되었으면 좋겠습니다!

아래에서는 구체적인 HTML 코드 예시를 통해 자세히 설명하겠습니다.

HTML에 하이퍼링크 앵커를 추가하는 코드 예제는 다음과 같습니다.

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
</head>
<body>
<a href="//m.sbmmt.com">PHP中文网</a>

<a href="#one">第一篇文章</a>
<a href="#two">第二篇文章</a>
<a href="#three">第三篇文章</a>

<a name="one"></a>
<h1>第一篇文章</h1>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>

<a name="two"></a>
<h1>第二篇文章</h1>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>

<a name="three"></a>
<h1>第三篇文章</h1>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>
<p>这是一段文章内容</p>

<a href="">回到顶部</a>
</body>
</html>
로그인 후 복사

이 코드에서는 주로 When을 사용합니다. HTML의

태그 에 옵니다. href="link address to jump to" 속성을 a 태그에 직접 추가하면 달성할 수 있는 텍스트 하이퍼링크입니다. 예를 들어, 위의 코드 섹션 PHP 중국어 웹사이트 지정된 링크 페이지입니다.

a 태그에

name=" #anchor name" 속성을 추가하면 앵커 링크 가 설정되었음을 의미합니다. 그런 다음 본문에서 지정된 위치에 앵커 포인트를 설정할 수 있습니다. 즉, a 태그에 name = "anchor name" 을 추가하면 됩니다. 여기에 # 기호를 추가하지 않도록 주의하세요.

위 코드의 전체적인 효과는 다음과 같습니다. 🎜## 🎜🎜#

HTML에 하이퍼링크와 앵커를 추가하는 방법과 기능에 대한 자세한 설명(동영상 첨부)페이지에 기사 콘텐츠의 큰 섹션이 있는 경우 페이지에 앵커 포인트를 설정하여 지정된 개체로 빠르게 이동할 수 있습니다. . 작업. 위와 같이 첫 번째 기사, 두 번째 기사, 세 번째 기사를 각각 클릭하면 지정된 콘텐츠 부분으로 빠르게 점프하게 됩니다. 동시에 기사 하단의 상단에 하이퍼링크를 다시 추가할 수 있습니다. a 태그의 href 속성 값을 비워두기만 하면 됩니다!

이 글은 HTML에 하이퍼링크와 앵커를 추가하는 방법과 기능에 대한 자세한 설명(동영상 첨부)HTML에서 하이퍼링크 앵커를 추가하는
의 구체적인 방법과 기능에 대한 내용이므로

앵커 링크와 일반 링크에 대해 어떻게 생각하시나요? 또한 하이퍼링크

간의 차이점을 어느 정도 이해하고 있어야 합니다. 위의 내용은 매우 간단하고 이해하기 쉽습니다. 도움이 필요한 친구들에게 도움이 되길 바랍니다! 해당 HTML에 하이퍼링크와 앵커를 추가하는 방법과 기능에 대한 자세한 설명(동영상 첨부)비디오 튜토리얼

[

HTML에 하이퍼링크를 추가하고 앵커 페이지에서 원하는 곳으로 이동
]을 참조할 수도 있습니다.

위 내용은 HTML에 하이퍼링크와 앵커를 추가하는 방법과 기능에 대한 자세한 설명(동영상 첨부)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿