* 본 포스팅은 간단한 웹문서 제작을 위한 HTML 정보글입니다.
1. 간단한 웹문서 제작을 위한 HTML의 기본
개인 홈페이지 제작의 필요성 정보화 시대, 빠르게 변화하는 사회 등등 어렸을 때부터 우리가 많이 듣던 이야기입니다. 그로부터 벌써 10년, 20년도 더 지난 현재 사회는 정말 빠르게 많은 직업
hooks.tistory.com
1. 메모장 준비하기
지난 포스팅에서는 홈페이지 제작을 위한 기본정보에 대해서 알아보았습니다.
그렇다면 웹문서는 어떻게 만들 수 있을까요?
먼저, 윈도즈에 기본적으로 깔려있는 메모장을 꺼내봅시다.
2. 웹문서 작성하기
HTML은 마크업 언어이기 때문에, 문단, 바디, 소제목, 기타 등등 의 기능을 제공하는 언어를 꺽쇠 <>로 표현합니다.
예를 들면, <코드>, 로 시작을 나타내고 마무리를 </코드> 꺽쇠 안 슬래쉬로 나타냅니다.
기본적인 웹문서를 작성하기 위한 순서
A. 가장 먼저 웹문서임을 나타내는 html 코드를 작성합시다.
<html>
</html>
B. 제목을 나타내는 head 코드 작성
<head>
</head>
head는 제목을 나타냅니다. 헤드라인 헤드라인 하자나요.
그리고 title은 홈페이지의 이름 부분을 나타냅니다. 코드를 다음과 같이 짜주세요.
<html>
<head>
<title>Page 1 </title>
</head>
</html>
그러면 다음과 같이 제목이 Page1인 빈문서가 됩니다.
C. 문단을 구성하는 body 코드 작성
<html>
<head>
<title> Page 1 </title>
</head>
<body>
This page is EXAMPLE.
</body>
</html>
D. 문단에 제목을 넣는 h1과 h2 코드
문단에도 제목을 넣어주려면 글자 크기가 달라지겠지요. 자동으로 그 크기를 제공하는 코드는 h1과 h2 코드입니다. 이 코드들은 제목과 소제목을 나타내는 크기를 기본적으로 제공하는 기본 코드입니다.
다음과 같이 코드를 작성하면 문단에 제목과 소제목을 나타낼 수 있습니다.
<html>
<head>
<title> Page 1 </title>
</head>
<body>
<h1> Big Example </h1>
<h2> Small Example </h2>
This page is EXAMPLE.
</body>
</html>
3. 웹문서 저장하고 브라우저로 열기
웹문서는 html 코드로 작성하였기 때문에, 저장할 때 파일 이름. txt로 저장하는 것이 아니고, 파일 이름. html로 작성하여야 합니다. 이때 웹문서를 보기 위해서는 파일을 오른쪽 마우스로 클릭하여 연결 탭에서 브라우저(익스플로러나 크롬)로 열어주면 작성한 웹문서를 볼 수 있습니다.
'COMPUTER SCIENCE > A piece of INFO.' 카테고리의 다른 글
| CSS 웹문서의 스타일 지정하기 (0) | 2021.05.14 |
|---|---|
| HTML 이미지 삽입코드와 사이즈 변경 (0) | 2021.05.13 |
| 홈페이지 제작을 위한 기본정보 (0) | 2021.05.11 |
| 전자회로 정보 _ 복호기(Decoder)와 인코더(Encoder) (0) | 2021.05.08 |
| [HTML] 수식을 위한 HTML 코드 정리 (0) | 2021.05.07 |
