반응형
기본 링크에서 새 창과 새 탭이 열리게 하기 위해서는 HTML <a href= > 링크 코드 부분에 target blank 코드를 넣어주면, 현재 탭은 그대로 있고 새 탭에서 클릭한 링크로 연결됩니다. 기존 창을 그대로 유지하고 싶은 경우 이 코드를 사용해주면 효율적으로 페이지를 관리할 수 있습니다.
코드 예시로 살펴보겠습니다.
1. 현재 페이지를 없애고 링크 이동
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title> 현재 페이지 없애고 링크 이동 </title>
</head>
<body>
<h3>
<a href="https://collocationvoca.tistory.com">새로운 링크 이동</a>
</h3>
</body>링크 코드의 수정 없이 그대로 이 코드를 사용한다면, 현재 페이지는 남기지 않고 링크로 이동하게 됩니다. 검색 페이지가 더 이상 필요없는 경우 움직임을 최소화 할 수 있어 효율적이지만, 검색 창을 띄워두고 여러 페이지로 이동할 경우 불편합니다.
2. 현재 페이지를 남긴 채로 링크 이동
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title> 현재 페이지 남기고 새로운 링크로 이동 </title>
</head>
<body>
<h3><a href="https://collocationvoca.tistory.com/" target="_blank">새로운 링크 이동</a></h3>
</body>body 태그 안 <a href= > 태그 안을 보면 target을 blank 코드로 입력한 것을 볼 수 있습니다. 이렇게 html을 입력하게 될 경우 새 탭에서 해당 링크가 열리게 됩니다.
저의 아주 작은 티끌 코딩 글이 블로그 방문자 님의 작업에 도움이 됐으면 좋겠습니다.
좋아요(❤) 버튼 ↙은 항상 감사합니다.
방문하신 모든 분들 좋은 하루 되세요 : )
반응형
'Programming Language > HTML & CSS (웹 개발 관련)' 카테고리의 다른 글
| [HTML / CSS] 이미지 불러오기 & 크기 조절 & 사진 파일이 없을 경우 작성하는 코드는 ?? (0) | 2021.07.12 |
|---|---|
| [ HTML ]링크 텍스트 클릭 전/ 후, 커서 밑 색깔 변화 & 링크 부분 밑줄 없애려면 ???(HTML CSS 링크 컬러 속성) (0) | 2021.07.09 |
| html 주석( 코맨트 : Comment) 과 인용( Quotation ) 은 어떻게 작성해야하나요 ??? (0) | 2021.07.04 |
| [ html / css ] 텍스트 취소선 , 밑줄 , 윗줄 그리고 텍스트 배경색은 어떻게 해야할까요 ??? (0) | 2021.07.03 |
| HTML 과 CSS 에서 문단 단락 띄어쓰기 ( 엔터 키 )하는 방법이 어떻게 되나요 ??? (0) | 2021.07.01 |
