메모장으로 HTML 작성하기
2021. 4. 15. 23:30ㆍ카테고리 없음
HTML을 작성하는 프로그램으로 HTML을 작성할 수도 있지만
윈도우 기본 프로그램인 메모장으로도 작성할 수 있다
인터넷에서 html 연습하는 사이트를 찾아서 열심히 따라 만들었다!
기본적인 기능만 알아도 이런 건 만들 수 있다
아니면
쉽게 만들 수 있다
'오래된 탭'의 HTML 코드는 이렇다
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title i18n-content="NTP_TITLE">오래된 탭</title>
</head>
<body>
</body>
</html>
탭 제목과 기본 틀만 썼기 때문에 <body>부분에는 아무것도 없다.
<body> 부분에 글을 적어 보면
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title i18n-content="NTP_TITLE">오래된 탭</title>
</head>
<body>
<p>오래된 탭!</p>
</body>
</html>
이번에는 글자 크기만 좀 키워서
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title i18n-content="NTP_TITLE">오래된 탭</title>
</head>
<body>
<h5>오래된 탭!</h5>
<h4>오래된 탭!</h4>
<h3>오래된 탭!</h3>
<h2>오래된 탭!</h2>
<h1>오래된 탭!</h1>
</body>
</html>
이번에는 구역을 나눠서 (div) 볼드체(b)와 이탈릭체(i)를 써 봅니다
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title i18n-content="NTP_TITLE">오래된 탭</title>
</head>
<body>
<div>
<h5>오래된 탭!</h5>
<h4>오래된 탭!</h4>
<h3>오래된 탭!</h3>
<h2>오래된 탭!</h2>
<h1>오래된 탭!</h1>
</div>
<div>
<b>오래된 탭(b)</b>
<i>오래된 탭(i)</i>
</div>
</body>
</html>
사진도 좀 넣어 봤습니다
명령어들에 관한 자세한 설명은 앞으로 계속 해드릴테니
다음 편에서 돌아오겠습니다!
궁금한점 댓글로 남겨주세요!