>  기사  >  웹 프론트엔드  >  HTML의 앵커

HTML의 앵커

王林
王林원래의
2024-09-04 16:38:46362검색

HTML 앵커 태그는 웹사이트 간 탐색, 한 페이지에서 다른 페이지로 이동, 마우스 클릭으로 이미지나 텍스트 열기에 사용되는 HTML의 가장 중요한 요소 중 하나입니다. 포함된 하이퍼링크의 시작과 끝을 정의하는 데 사용됩니다. 대부분 이는 검색 엔진에서 대상 URL을 정의하는 데 사용됩니다. 유익하고 랜딩 페이지와 더 관련성이 높습니다.

해당 링크는

과 같은 다른 시나리오에서 다른 의미를 나타냅니다.
  • 밑줄과 빨간색이 표시된 링크는 활성 링크를 나타냅니다
  • 밑줄과 보라색으로 표시된 링크는 방문한 링크를 나타냅니다.
  • 밑줄이 그어져 있고 파란색으로 표시된 링크는 방문하지 않은 링크를 나타냅니다.

구문:

를 정의하는 실제 구문을 살펴보겠습니다. 태그.

<a href="Link_URL">Link Home</a>

위에 표시된 대로 구문 아래에 정의된 주요 부분이 포함된 링크가 포함된 태그:

HTML의 앵커

1. href 속성

이 속성은 대상 주소를 알 수 있는 하이퍼링크를 정의하는 데 사용됩니다. 하이퍼링크는 웹페이지 문서와 대상 링크 사이의 커넥터 역할을 합니다.

  2. 이름 속성

의 이름 속성 태그는 페이지의 특정 지점으로 이동하는 데 사용됩니다.

  3. Target attribute

  • The target attribute is used to define the destination page or the defined target page may be opened.
  • It’s used as a common option that is used by target attributes to link with other pages.
  • If the target attribute defines with a blank value like “target=_blank” then it will open a new tab at the target location.

4. Title Attribute

  • The title attribute is one of the important attributes used to give special attention where one can easily move when they click the link.
  • If the user moves the mouse pointer onto the link reference, the title text which was given into the attribute point will be shown there.
  • It works like a tooltip or details where the link will navigate. This approach makes webpages or documents more user-friendly.

Working of Anchor in HTML

Examples

Here we are going to show some examples having use of actual tag.

1. HTML code

<h4>Examples for Anchor in HTML </h4>
<a href="https://timesofindia.indiatimes.com/">Latest News </a><br><br>
<a href="HTMLcolor.html">Navigate on other File</a><br>

Output:
 HTML의 앵커

On clicking the latest news, the output is :HTML의 앵커

 By clicking on the link Navigate on other File” it will show another webpage as:
HTML의 앵커

2. HTML Code

<h2>Reach to EDUCBA </h2>
<ul>
<li><a href="https://www.educba.com/">Website</a></li>
<li><a href="mailto:[email&#160;protected]">Email US</a></li>
<li><a href="tel:+123456789">Phone</a></li>
</ul>

 Output :

HTML의 앵커

The output shows some links, and that those links are in blue they are unvisited, the link showing in purple has visited the link and this is used to show the difference in links.

3. HTML Code

<h4>Image and File Demo</h4>
<p><a href="C:\Users\\Sonali\Desktop\jerry.jpeg">Image Demo</a> It will
open image</p>
<a href="./generate-zip?id=4" download="assets.zip">Download File</a>

Output :

HTML의 앵커

While clicking on image demo it will open the image as:HTML의 앵커

 While clicking on another link it will download the file as :HTML의 앵커

결론 - HTML의 앵커

HTML의 앵커 태그는 대상 위치로 직접 이동하는 링크를 정의하는 데 사용됩니다. hre 속성, 이름 속성, 대상 속성과 같은 주요 구성요소를 기반으로 합니다. 태그는 내부 및 외부 링크뿐만 아니라 절대 및 상대 URL에도 사용됩니다.

위 내용은 HTML의 앵커의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.