[HTML] 1-7 다른 곳으로의 링크

Yumin Jung·2023년 1월 12일
0

a태그와 속성

<a href="(연결할 주소)" target="(링크를 어떻게 열지)">

href = hyperlink reference

target 요소 태그 속성

target 속성은 링크를 어떻게 열지에 대한 방식을 정하는 것이다. 예를 들어 링크를 누른 그 탭에서 열거나, 새 탭을 열어서 여는 등의 방식을 정하는 것이다.

_self : 그 탭에서 열리게끔.
_blank : 새 탭에서 열리게끔. (제일 많이 사용) -> 텍스트나 내부 이미지 등으로 (alt) 명시 필요.

<a href="https://www.naver.com">
 <img src=" " alt="~로 가는 링크입니다.(새 탭에서)">
</a>

_parent (iframe 관련)
_top (iframe 관련)
이 있다.

a:link 를 쓰면 기본으로 emmet에 의해 href 속성이 미리 작성
p#target${id:target$}*1000
된다
.

https 에 s 명시 되어야한다. 요즘 웬만한 안전한 사이트들은 https를 쓴다.

실제로 웹사이트를 만들 때는 가능한 사진을 저장한 후 상대경로로 이미지를 등록하는 것이 낫다. 서버에서 이미지가 사라질 수도 있으니!

id값을 활용한 요소로의 이동

emmet의 어떤 요소에 ID 속성을 지정할 때는 #을 사용한다.
p#target_${id:target_$}*1000

<p id:"target_1">id: target_1</p>
<p id:"target_2">id: target_2</p>
<p id:"target_3">id: target_3</p>
<p id:"target_4">id: target_4</p>
<p id:"target_5">id: target_5</p>
<p id:"target_6">id: target_6</p>
<p id:"target_7">id: target_7</p>
.
.
<p id:"target_1000">id: target_1000</p>


<a href="#target_500">타깃으로 이동</a>

address 태그

전화 -> <a href="tel:010-9000-0000">010-9000-0000</a>
이메일 -> <a href="mailto:mike7643@naver.com">mike7643@naver.com</a>

이렇게 써서 전화번호연결 or 이메일링크 바로 연결 가능
ex) 휴대폰에서 하면 전화 바로 연결 등
profile
문과를 정말로 존중해

0개의 댓글