자기개발하는 QA
맛집지도 만들기 01. 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">
<meta name="author" content="서히" />
<meta name="description" content="맛비게이터 지도" />
<meta
name="keyword"
content="서히지도, 맛비게이터, 맛비게이터지도"
/>
<title>맛비게이터지도 제작중</title>
<style>
h1 {
color: blueviolet
}
</style>
<!--
파일을 분리할 떄는 <link rel="stylesheet" href="./style.css"/>
-->
</head>
<body>
<h1> 안녕하세요</h1>
<!--div-->
<div>안녕하세요. div</div>
<div>안녕하세요. div</div>
<!--span-->
<span>안녕하세요. span</span>
<span>안녕하세요. span</span>
<div>안녕하세요 <span style="color:red;">홍길동</span>입니다</div>
<!--ul, ol-->
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
<ol>
<li>1</li>
<li>2</li>
<li>3</li>
</ol>
<!--h1~h6-->
<h6>안녕</h6>
<!--Img-->
<img src="./한개.jpeg" alt="강아지사진" />
<!--input-->
<input type="text" />
<!--button-->
<botton>클릭하세요</botton>
<!--a-->
<a href="https://www.naver.com">네이버</a>
<script>
const tag = document.querySelector("h1");
tag.addEventListener("click", ()=> {
tag.style.color = "yellow";
});
</script>
</body>
</html>728x90
'지식 > 개인프로젝트' 카테고리의 다른 글
| HTML&CSS 6. Music Player (0) | 2022.01.05 |
|---|---|
| HTML&CSS 5. 책 소개 페이지 (0) | 2022.01.03 |
| HTML&CSS 4. 플레이 리스트 만들기 (0) | 2022.01.03 |
| HTML&CSS 3. 음악 재생 화면 만들기 (0) | 2022.01.02 |
| HTML&CSS 2. Color Chip (0) | 2021.12.31 |
'지식/개인프로젝트' Related Articles
more
