728x90
반응형
[HTML&CSS 스터디] 10. 링크 만들기 <a>
링크를 만드는 <a> 태그
<!doctype html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>고양이의 일상</title>
<meta name="description" content="고양이가 좋아하는 것과 일상을 소개합니다.">
</head>
<body>
<h1>고양이의 하루</h1>
<img src="a.jpg" alt="꽁꽁냥">
<a href="https://namu.wiki/w/%EA%BD%81%EA%BD%81%20%EC%96%BC%EC%96%B4%EB%B6%99%EC%9D%80%20%ED%95%9C%EA%B0%95%20%EC%9C%84%EB%A1%9C%20%EA%B3%A0%EC%96%91%EC%9D%B4%EA%B0%80%20%EA%B1%B8%EC%96%B4%EB%8B%A4%EB%8B%99%EB%8B%88%EB%8B%A4">뉴스 페이지로 이동하기</a>
<p>꽁꽁 얼어붙은 한강 위로 고양이가 걸어다닙니다. 돌을 던져봐도 끄떡없습니다.</p>
</body>
</html>
-링크의 대상(이동할 웹 페이지의 주소)는 href 속성에 작성한다.
-같은 폴더의 다른 파일로 이동할 때에는 해당 파일의 이름만 적어주면 된다.
-이미지를 링크로 만들고 싶을 때에는 <img>태그를 <a> 태그로 감싸주자!
728x90
반응형
'HTML,CSS, JS > HTML&CSS 스터디' 카테고리의 다른 글
| [HTML&CSS 스터디] 12. 입력 양식 만들기 <form> (0) | 2024.07.07 |
|---|---|
| [HTML&CSS 스터디] 11. 리스트 출력하기 <ul>,<li> (0) | 2024.07.07 |
| [HTML&CSS 스터디] 9. 파일 경로 지정하기 (0) | 2024.07.06 |
| [HTML&CSS 스터디] 8. 이미지 삽입하기 <img> (0) | 2024.07.06 |
| [HTML&CSS 스터디] 7. 문장 출력하기 <p> (0) | 2024.07.06 |