본문 바로가기
개발/프론트엔드-HTML,CSS

기본 태그를 이용해서 가고 싶은 여행지 말해보기

by 쑨토리 2023. 1. 9.
반응형

가고 싶은 여행지를 말하고, 함께 가자는 초대장을 만들어봤다.

 

짠!!!

 

 


이미지 태그와 링크 태그를 이용했더니 그럴싸 해진다. 

해당 태그 사용법은 아래 링크에서 확인하면 된다.

<!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