HTML의 앵커
HTML 앵커 태그는 웹사이트 간 탐색, 한 페이지에서 다른 페이지로 이동, 마우스 클릭으로 이미지나 텍스트 열기에 사용되는 HTML의 가장 중요한 요소 중 하나입니다. 포함된 하이퍼링크의 시작과 끝을 정의하는 데 사용됩니다. 대부분 이는 검색 엔진에서 대상 URL을 정의하는 데 사용됩니다. 유익하고 랜딩 페이지와 더 관련성이 높습니다.
해당 링크는
과 같은 다른 시나리오에서 다른 의미를 나타냅니다.- 밑줄과 빨간색이 표시된 링크는 활성 링크를 나타냅니다
- 밑줄과 보라색으로 표시된 링크는 방문한 링크를 나타냅니다.
- 밑줄이 그어져 있고 파란색으로 표시된 링크는 방문하지 않은 링크를 나타냅니다.
구문:
<a href="Link_URL">Link Home</a>
위에 표시된 대로 구문 아래에 정의된 주요 부분이 포함된 링크가 포함된 태그:
1. href 속성
이 속성은 대상 주소를 알 수 있는 하이퍼링크를 정의하는 데 사용됩니다. 하이퍼링크는 웹페이지 문서와 대상 링크 사이의 커넥터 역할을 합니다.
- 다른 웹사이트일 수도 있고 이미지나 파일일 수도 있습니다. Href는 우리가 필요로 하는 대상 주소를 정의하는 데 사용되는 하이퍼텍스트 참조의 약어입니다. '=' 기호는 속성과 해당 연결 값의 연결을 정의하는 데 사용됩니다.
- 위 구문에서 href는 사이의 링크가 해당 값으로 알려진 속성으로 간주됩니다. 태그 사이에 있는 값이 앵커 텍스트 또는 링크입니다. 사용자가 보거나 클릭할 수 있는 것
- 예: 인도의 시대
2. 이름 속성
의 이름 속성 태그는 페이지의 특정 지점으로 이동하는 데 사용됩니다.
- It’s most useful for defining large pages or to define subdivisions.
- Example:Homepage So in this example we are adding #tag at the anchor name. it’s helpful to the browser to find or jump to the defined location like home. #name can be placed after the filename.
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
- There are two scenarios through which we can anchor tags like Internal link and External link.
- Internal links are those which are showing entities that are other pages of our domain, where external links are used to show web pages that don’t consider as a part of our domain.
- Let’s see how anchor tag exactly works with both links. Internal links work as a navigator between websites to show navigation menus which are useful to everyone who visits the website can easily navigate on the required menu. As discussed above in the title attribute, internal links are useful to navigate on specific content.
- Those are also used by search engine web crawlers to exactly define the pages of a website as well as for sharing authority purposes.
- External links play an important role in tag, it’s always best practice to provide exact attribution to the source. It is useful for related content, which can show us for referring website visitors.
- Sometimes other sites upload some kind of external links, which are going to point towards our website is considered as backlinks, those give permission to flow into our site which is beneficial to improve the position of our site at SERP. (Search Engine Result Page).
- One more good thing to keep our visitors on our site for a longer time, by using target=”_blank” while writing external links, which will open a new tab.
- The text we are going to use as an Ideal anchor text identifies keywords, which are more suitable to the web page.
- Working with anchor by using Absolute and Relative By using absolute URL one can see the whole description of the destination link. It contains protocol which helps to complete domain name to reach the destination.
- Relative URL used to link given web pages showing the exact position of the relative towards the position of the current page.
- Whenever internal links are written, which are showing other pages of the same site in this case we are going to write relative URLs.
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:
On clicking the latest news, the output is :
By clicking on the link “Navigate on other File” it will show another webpage as:
2. HTML Code
<h2>Reach to EDUCBA </h2> <ul> <li><a href="https://www.educba.com/">Website</a></li> <li><a href="mailto:[email protected]">Email US</a></li> <li><a href="tel:+123456789">Phone</a></li> </ul>
Output :
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 :
While clicking on image demo it will open the image as:
While clicking on another link it will download the file as :
결론 - HTML의 앵커
HTML의 앵커 태그는 대상 위치로 직접 이동하는 링크를 정의하는 데 사용됩니다. hre 속성, 이름 속성, 대상 속성과 같은 주요 구성요소를 기반으로 합니다. 태그는 내부 및 외부 링크뿐만 아니라 절대 및 상대 URL에도 사용됩니다.
위 내용은 HTML의 앵커의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

핫 AI 도구

Undresser.AI Undress
사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover
사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool
무료로 이미지를 벗다

Clothoff.io
AI 옷 제거제

AI Hentai Generator
AI Hentai를 무료로 생성하십시오.

인기 기사

뜨거운 도구

메모장++7.3.1
사용하기 쉬운 무료 코드 편집기

SublimeText3 중국어 버전
중국어 버전, 사용하기 매우 쉽습니다.

스튜디오 13.0.1 보내기
강력한 PHP 통합 개발 환경

드림위버 CS6
시각적 웹 개발 도구

SublimeText3 Mac 버전
신 수준의 코드 편집 소프트웨어(SublimeText3)

뜨거운 주제











HTML의 테이블 테두리 안내. 여기에서는 HTML의 테이블 테두리 예제를 사용하여 테이블 테두리를 정의하는 여러 가지 방법을 논의합니다.

HTML 여백-왼쪽 안내. 여기에서는 HTML margin-left에 대한 간략한 개요와 코드 구현과 함께 예제를 논의합니다.

HTML의 Nested Table에 대한 안내입니다. 여기에서는 각 예와 함께 테이블 내에 테이블을 만드는 방법을 설명합니다.

HTML 테이블 레이아웃 안내. 여기에서는 HTML 테이블 레이아웃의 값에 대해 예제 및 출력 n 세부 사항과 함께 논의합니다.

HTML 입력 자리 표시자 안내. 여기서는 코드 및 출력과 함께 HTML 입력 자리 표시자의 예를 논의합니다.

HTML 순서 목록에 대한 안내입니다. 여기서는 HTML Ordered 목록 및 유형에 대한 소개와 각각의 예에 대해서도 설명합니다.

HTML에서 텍스트 이동 안내. 여기서는 Marquee 태그가 구문과 함께 작동하는 방식과 구현할 예제에 대해 소개합니다.

HTML onclick 버튼에 대한 안내입니다. 여기에서는 각각의 소개, 작업, 예제 및 다양한 이벤트의 onclick 이벤트에 대해 설명합니다.
