[HTML] 4. 링크 삽입하기

2024년 04월 15일

Song hyun
작성자
2024.04.15.:55

728x90

[HTML] 4. 링크 삽입하기

(1) <a> 태그: 링크를 삽입 할 때는 <a> 태그를 사용한다. (<a href=””></a>)

(2) <a>+<img>: <img> 태그를 함께 사용하여 이미지에 링크를 삽입 할 수도 있다.

(3) 메일 전용 링크: href 속성에 “mailto:”를 덧붙여 사용하면, 이메일 전용 링크 역시 만들 수 있다.

*<a href>와 <a href target>: <a href>의 경우는 현재 열려 있는 창에서 링크에 접속한다.

<a href target=”_blank”>의 경우는, 클릭 시 새 탭이 생기며 이동한다.

(6)<iframe>: html 문서 삽입 시 사용하는 태그. (ex: <iframe src=”문서 이름, 위치”>)

*<iframe>을 허용하는 웹사이트가 따로 있다.

*<a href targer=”_top”>은 화면 전체가 전환되지만,

일반적인 <a href>의 경우, 아래에 삽입된 작은 창 안에서 웹사이트가 전환된다.

"쇼핑몰"이라는 글자에 링크가 삽입된 모습.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h2>맛있는 청송 사과가 한 알에 천 원!</h2>
    <!-- <a> 태그와 href 속성을 사용하여, "쇼핑몰"이라는 글자에 링크를 삽입했다.-->
    지금 바로 <a href="https://www.google.com/search?sca_esv=6c68902c3d717b8b&sca_upv=1&q=%EC%82%AC%EA%B3%BC&tbm=isch&source=lnms&prmd=isvnmbz&sa=X&sqi=2&ved=2ahUKEwjhuZeX5Z-FAxWchVYBHXgLBQ4Q0pQJegQIIBAB&biw=1449&bih=924&dpr=1#imgrc=H2VDAVNHl5uZuM"> 쇼핑몰</a> 로 오세요!
</body>
</html>

728x90

'HTML,CSS, JS > HTML' 카테고리의 다른 글

[HTML] 6. 폼 관련 태그 (0)	2024.04.22
[HTML] 5. 표(테이블) 만들기 (0)	2024.04.15
[HTML] 3. 이미지 출력하기 (0)	2024.04.14
[HTML] 2. HTML 기본 태그 (0)	2024.04.14
[HTML] 1. 기초 CS 지식 (0)	2024.04.14

다음 글이 없습니다.

이전 글이 없습니다.

[HTML] 4. 링크 삽입하기

'HTML,CSS, JS > HTML' 카테고리의 다른 글

티스토리툴바