반응형
가고 싶은 여행지를 말하고, 함께 가자는 초대장을 만들어봤다.
짠!!!
이미지 태그와 링크 태그를 이용했더니 그럴싸 해진다.
해당 태그 사용법은 아래 링크에서 확인하면 된다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>내가 가고 싶은 나라 보여줄게</title>
</head>
<body>
<h2>내가 이전에 갔던 나라 소개</h2>
<p>나는 예전에 태국을 다녀왔어. 추운걸 싫어하는 나로선 최고의 휴양지였어.</p>
<img src="https://www.phiphi-island.nu/wp-content/uploads/sites/26/2018/05/tempel-i-thailand.jpg" height="200px">
<p>그런데 최근에 겨울의 매력에 빠져버렸지뭐야?</p>
<h2> 최근에 내가 가고 싶은 나라 소개</h2>
<p>그래서 어딜 가고 싶냐면....</p>
<img src="https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&fname=https%3A%2F%2Ft1.daumcdn.net%2Fcfile%2Ftistory%2F9938DF4E5C2A01262B" height="300px">
<p>바로 여기야! 나와 삿포로 가고 싶다면... <a href ="https://www.myrealtrip.com/offers?t=llp&qct=Sapporo&qcr=Japan&ext_categories=tour&offers=&mktcity=120&sort=selling_count%3Adesc&utm_source=google&utm_medium=cpc&utm_campaign=18382536472&utm_content=141863986295&utm_term=kwd-316052883565&gclid=CjwKCAiA8OmdBhAgEiwAShr40_P1kxI_oHxmOA1vFzSxguYxZgMB2XwRE4T6J1MbHeDWiZQSm_TfQBoCGrwQAvD_BwE" target="_blank">여기</a>를 눌러서 투어신청을 해줘.</p>
</body>
</html>
💡 아래는 없는 새로 사용한 태그!
target="_blank"
링크 태그에 링크를 적어준 뒤, 바로 뒤에 타겟 =" 언더바 블랭크"를 적어주면,
요청할 링크 창이 열릴때 새 창으로 열리게 된다!!!
target을 사용하지 않으면 해당 페이지에 창이 덮어씌워짐.
https://ssoontory.tistory.com/144
HTML 기본 태그
💡텍스트 태그 머릿글 level 1 머릿글 level 2 단락을 넣어주는 p태그 💡링크 태그 1. p태그 안에 a태그를 만들어 링크를 걸고싶은 단어를 사이에 둔다! 2. 그리고 a태그에 href=""을 적어 넘어갈 링
ssoontory.tistory.com
'개발 > 프론트엔드-HTML,CSS' 카테고리의 다른 글
CSS 셀렉터 (0) | 2023.01.10 |
---|---|
입력 폼 만들기 (더 추가할 예정) (0) | 2023.01.09 |
HTML 기본 태그 (0) | 2023.01.09 |
[HTML] html 태그의 dir 속성 (0) | 2023.01.04 |
나만의 버킷리스트 만들기 (완성) _ (feat.스파르타코딩클럽) (0) | 2022.12.26 |