HTML의 새 탭에서 링크 열기

Sushant Poudel 2023년2월19일
HTML의 새 탭에서 링크 열기

이 기사에서는 HTML의 새 탭에서 링크를 여는 방법에 대해 설명합니다.

target="_blank"를 사용하여 HTML의 새 탭에서 링크 열기

앵커 태그의 target 속성을 사용하여 HTML의 새 탭에서 링크를 열 수 있습니다. 앵커 태그의 target 속성에 있는 _blank 값은 새 탭에서 링크를 엽니다. 앵커 태그 <a>는 한 페이지에서 다른 페이지로 연결하는 데 사용되는 하이퍼링크를 정의합니다. href 속성은 링크하려는 페이지의 URL을 설정합니다. target="_blank" 옵션은 링크를 새 탭으로 전환합니다. _blank 값은 브라우저 설정에 따라 새 탭에서 링크를 열도록 브라우저에 알립니다. 보안 조치로 noopener noreferrer 값을 사용하여 앵커 태그에 rel 속성을 추가할 수 있습니다. rel=" noopener noreferrer"는 새로 열린 탭이 원래 탭을 악의적으로 수정하는 것을 방지하기 위한 것입니다. 그러나 최신 브라우저는 target= "_blank" 옵션을 사용할 때 암시적으로 옵션을 설정합니다.

예를 들어, HTML 본문 내에서 앵커 탭 <a>을 열고 그 안에 href 속성을 입력합니다. href 속성의 값으로 https://www.facebook.com/ URL을 작성합니다. 그런 다음 앵커 태그의 속성으로 target을 쓰고 _blank 값을 지정합니다. 그 뒤에 noopener noreferrer 값으로 rel 속성을 작성합니다. 그런 다음 앵커 태그 사이에 Link라는 텍스트를 작성하십시오. 마지막으로 body 태그 뒤에 오는 앵커 태그를 닫는 것을 잊지 마십시오.

아래 예는 Link라는 단어를 클릭하면 새 탭을 엽니다. 링크를 클릭하면 Facebook 페이지가 열립니다.

예제 코드:

<body>
    <a href="https://www.facebook.com/" target="_blank" rel="noopener noreferrer" >
        Link
    </a>
</body>
Sushant Poudel avatar Sushant Poudel avatar

Sushant is a software engineering student and a tech enthusiast. He finds joy in writing blogs on programming and imparting his knowledge to the community.

LinkedIn