Hyper Text Markup Language로 웹사이트에서 정보와 구역등을 설정 할 수 있습니다.
현재는 HTML5의 버전을 사용하고 특징은 semantic한 언어입니다.
HTML의 문법 형태는 아래와 같습니다!
<OPENING 태그 속성 = "속성값">컨텐츠(정보 내용)</CLOSING 태그>
#EX
<!DOCTYPE html> # HTML5를 선언하는 태그!
<html> #HTML문서의 시작
<head> #head 태그, 간단한 요약정보
<meta charset="UTF-8"> # 모든문자를 깨짐없이 표시하기 위한 코드
<title>Document</title> # 브라우저의 탭의 제목을 나타내는 타이틀 태그
</head>
<body> #바디 태그, 웹사이트의 내용을 포함
</body>
</html> #HTML문서의 끝!
<img>
태그 : 이미지를 삽입하는 태그!
<img src ="https://cdn.pixabay.com/photo/2019/08/07/14/10/golden-retriever-4390884__340.jpg" alt="강아지">
<img>
태그는 닫아주는 태그 없이 사용합니다~!
src 속성은 source 로써 파일 경로를 불러오고,
alt 속성은 이미지가 어떤이유로 출력 되지 않을 경우, 이미지의 설명 텍스트가 대체되어 출력되는 역할을 합니다.
<h>
태그 : 블록 요소
<h1>Hello World</h1>
<h2>Hello World</h2>
<h3>Hello World</h3>
<h4>Hello World</h4>
<h5>Hello World</h5>
<h6>Hello World</h6>
Heading 즉 제목이나 부제목 표현할때 쓰입니다.
<h1>
태그는 가장 큰 제목이기 때문에 하나의 문서에서 반드시 하나만 사용합니다.
<p>
태그 : 블록 요소
<p>I love you</p>
본문의 내용을 쓸때 사용합니다! (주요 텍스트 단락을 표현)
<ul>
태그 :
<ul>
<li>메뉴1</li>
<li>메뉴2</li>
<li>메뉴3</li>
</ul>
unordered list의 약자로, 순서가 상관없는 리스트를 생성 할 때 사용합니다. (자식 태그로 <li>
태그를 달고 다닌다! 보통 메뉴버튼을 만들 때 사용한다.)
*<ol>
ordered list도 있습니다. 사용법은 <ul>
태그와 동일 하나 출력했을시 숫자의 순서로 표시됩니다. ex) 1.첫번째 예시 2. 두번째 예시
<a>
태그 : 인라인 요소
<a href="https://www.naver.com/" target="_blank">네이버</a>
<a>
태그는 택스트나 이미지를 클릭했을때, 다른 웹페이지로 이동시키는 기능을 가지고 있는 태그 입니다.
(하이퍼링크 기능) href속성은 연결할 웹페이지의 주소를 불러오고, target속성은 연결 방식을 결정!