물멍IT

[Web] - html기초(1) _ 역할과 기본구성 본문

Web

[Web] - html기초(1) _ 역할과 기본구성

derlung 2020. 2. 17. 16:48

1) HTML 의 정의

 

   - 'Hyper Text Markup Language'의 줄임말로 웹페이지의 내용을 담당

   -  마크업은 문서의 어느 부분이 어느 역할을 하는지 명시하는 것(태그로 감싸주는 행위)

 

 

 

2) 웹 구성요소 - HTML, CSS , JS

 

HTML 웹의 기본적인 내용과 의미를 담당
CSS 페이지의 외형을 담당
JS 페이지의 동적 동작을 담당

 

 

3) HTML의 기본구성 - 크게 head, body로 나눌 수 있다.

 

<!DOCTYPE html> #HTML 웹 페이지 문서 타입이라는 것을 명시
	<html >
		<head>
        	# 웹 페이지 에서 보이지 않는 정보들을 담는 영역
		</head>
		<body>
    		# 웹 페이지의 직접적으로 보이는 정보들을 담는 영역
		</body>
	</html>

 - head에는 글자 인코딩, 스타일같은 설정 정보를 담을 수 있다.

 - body에는 문서를 명시하는 태그들을 담는다. 글자태그 리스트 태그같은 페이지 내에서 

   사용자에게 직접적으로 보여지는 부분이다.

 - html의 기본문법은 태그 사이에 내용을 넣는 것이다. 아래의 간단한 예제를 보자

 

 

 4) 간단한 예제

    페이지에 "HI HTML~!!"를 띄어보자.

    body에 글자태그 <h1>에 "HI HTML~!!"를 담고 실행시킨다.

 

[코드]

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>연습1</title>  <!--페이지의 타이틀-->
</head>
<body>
    <h1>HI HTML~!!</h1> 
</body>
</html>

 [결과화면]

이런식으로 간단한 html 페이지를 만들어 본다.

 

'Web' 카테고리의 다른 글

[Apache-Tomcat] - 톰캣 설치 및 이클립스 연동  (0) 2020.04.15
[Web] - html기초(0)_Visual Studio Code 확장팩  (0) 2020.02.19
'Web' Related Articles more