프로그래밍/HTML

HTML - 기초

hustle-ing 2023. 3. 30. 17:22

HTML(HyperText Markup Language)

웹 페이지의 틀을 만드는 마크업 언어

 

 

여러가지 tag를 이용한 HTML 예시

<!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>Document</title>
</head> <!-- 기본 셋팅 -->
<body>
<div>div</div> <!-- 한줄을 차지한다 -->
<span>span</span> <!-- 컨텐츠 크기만큼 공간을 차지한다 -->
<span>sapn</span>
<img src = "./IMG_0713.JPG"> <!-- 닫는 태그를 쓰지 않아도 된다 -->
<a href="https://google.com" target="_blank">구글</a> <!-- 링크를 만든다 -->
<ul> <!-- unodered list -->
<li>1</li>
<li>2</li>
</ul>
<ol> <!-- odered list -->
<li>1</li>
<li>2</li>
</ol>
<input type = "text" placeholder="type here"> <!-- text. 아이디, 비밀번호 같은 입력폼에 유용 -->
<input type = "checkbox" name="check" value="d"> d <!-- checkbox. 모두 선택 가능 -->
<input type = "checkbox" name="check" value ="c"> c
<input type = "radio" name="choice" value="a"> a <!-- radio. 하나만 선택 가능. name 속성을 이용하여 그룹나눔-->
<input type = "radio" name="choice" value="b"> b
<textarea></textarea> <!-- 줄바꿈이 가능한 입력폼 -->
<button>submit</button> <!-- 버튼 -->
</html>