MARK UP/HTML

HTML -1(#5)

두비_ 2019. 8. 13. 00:35
반응형

웹사이트에서 각각 요소가 무엇을 뜻하고 알려주는 언어가 HTML입니다

HTML은 대게 Tag를 사용합니다 즉 Tag로 이루어진 텍스트 문서라고 할 수 있습니다

이론은 재미없으니 실전을 통해서 바로 확인해봅시다

 

#4에 github desktop에서 만들었던 폴더가 있을 겁니다 필자는 TEST로 지정하였습니다 vscode에서 해당 폴더를 켜시고 폴더에 제목 이름 "index.html"를 작성해주세요

index를 쓴 이유는 웹 서버들이 index 파일을 제일 먼저 찾도록 디폴트 값으로 설정되어 있기때문입니다

 

이제 태그를 작성할 것입니다

*당부하지만 아래처럼 사용하는 태그는 실제로 없습니다 이해를 돕기위해 만들어낸 태그입니다*

태그는 보통 이렇게 생겼어요

<이름 속성="값">내용</이름>

<food meat="beef">고기는 역시 소고기</food>

태그가 있고 그 가운데에 들어가야할 컨텐츠를 넣습니다 그 다음 태그를 닫습니다

태그를 열고 닫기 때문에, 태그 사이에 위치한 컨텐츠가 태그가 명칭하는 것으로 알 수 있습니다

 

자 그럼 실제로 사용하는 태그를 사용하여 띄워봅시다

<title>여기가 제목입니다</title>

제목 바에 보이시나요? html문서에서 title인 제목 태그는 저기에 사용됩니다

 

<p>여기가 글 내용이에요</p>

문단 태그는 이렇게 사용됩니다

 

<a href="https://www.google.com">구글로 이동</a>

링크 이동입니다 원하는 링크를 띄우고 글을 눌렀을 때 이동되게끔 하고 싶다면 이 태그를 지정해주시면 됩니다

 

<a href="https://www.google.com" target="_blank">구글로 이동</a>

 

링크가 새탭으로 켜지게 하고 싶을 때 사용합니다

 

꼭 구글뿐만 아니라 네이버,다음 등등 웹사이트는 모두 해당됩니다 단! "http://" or "https://"를 붙여주셔야합니다

여기까지입니다 감사합니다