HTML은 하이퍼링크를 사용하여 웹의 다른 문서에 연결합니다.
거의 모든 웹페이지에서 링크를 찾을 수 있습니다. 한 페이지에서 다른 페이지로 이동하려면 링크를 클릭하세요.
먼저 링크 예제를 살펴보겠습니다
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>php.cn</title> </head> <p><a href="/">PHP中文网</a> 是一个指向本网站中的一个页面的链接。</p> <p><a href="http://www.baidu.com/">百度</a>这是一个指向百度的链接</p> </body> </html>
코드 실행 결과:
HTML 하이퍼링크(링크)
HTML은 <a> 태그를 사용하여 하이퍼텍스트 링크를 설정합니다.
하이퍼링크는 단어, 단어, 단어 그룹 또는 이미지일 수 있습니다. 이러한 내용을 클릭하면 새 문서나 특정 문서로 이동할 수 있습니다. ~의 일부.
웹 페이지의 링크 위에 마우스 포인터를 올리면 화살표가 작은 손 모양으로 변합니다.
<a> 태그에 href 속성이 사용되어 링크 주소를 설명합니다.
예를 들어 php.cn 사이트의 홈페이지에 링크를 걸면 다음과 같이 표현할 수 있습니다.
<a href="http://www.php.cn">PHP 중국어 웹사이트</a>
기본적으로 링크는 브라우저에 다음과 같이 표시됩니다.
방문하지 않은 링크는 파란색 글씨로 밑줄이 그어져 표시됩니다.
이 방문한 링크는 보라색으로 밑줄이 그어져 표시됩니다.
링크를 클릭하면 링크가 빨간색으로 표시되고 밑줄이 그어집니다.
참고: 이러한 하이퍼링크에 CSS 스타일이 설정된 경우 표시 스타일은 CSS 설정에 따라 표시됩니다.
HTML 연결 - id 속성
id 속성은 HTML 문서에서 북마크 태그를 생성하는 데 사용할 수 있습니다.
팁: 북마크는 특별한 방법으로 표시되지 않으며 HTML 문서에도 표시되지 않으므로 독자에게 숨겨집니다.
HTML 문서에 ID 삽입:
<a id="tips">유용한 팁 섹션</a>
HTML 문서의 "유용한 팁 섹션(id="tips")"에 대한 링크 만들기:
<a href="#tips"> ; 유용한 팁 섹션</a>
또는 다른 페이지에서 "유용한 팁 섹션(id="tips")"에 대한 링크를 만드세요:
<a href="http://www.php.cn/html/html-links.html#tips">
유용한 팁 섹션을 방문하세요< /a>
기본 메모
참고: 하위 폴더에는 항상 슬래시를 추가하세요. 링크가 href="http://www.php.cn/html"과 같이 작성되면 두 개의 HTTP 요청이 서버에 생성됩니다. 이는 서버가 주소에 슬래시를 추가한 다음 href="http://www.php.cn/html/"과 같이 새 요청을 생성하기 때문입니다.
예
이미지 링크 사용방법.
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>php.cn</title> </head> <body> <p>创建图片链接: <a href="http://www.php.cn/"> <img src="1.jpg" alt="HTML 教程" width="50" height="50"></a></p> <p>无边框的图片链接: <a href="http://www.php.cn/html/"> <img border="0" src="1.jpg" alt="HTML 教程" width="50" height="50"></a></p> </body> </html>
이미지는 나중에 설명할 <img> 태그를 사용합니다.
코드 실행 결과:
위 사진을 클릭하시면 http://www.php.cn/