HTML(Hyper Text Markup Language)이란?
- 웹 페이지에서 다른 페이지로 이동할 수 있도록 하는 기능을 가진 문서를 만드는 작업입니다.
- .html, .htm *확장자 포맷을 가지고 있습니다.
- 웹이 해석을 해서 구조를 통해 화면에 *렌더링 해주게 되고 사용자가 View라고 하는 스크린을 통해 확인할 수 있습니다.
*확장자 포맷 : 이미지 파일 형식 즉, 저장법
*렌더링 : 컴퓨터 프로그램을 사용하여 모델 또는 이들을 모아놓은 장면인 씬 파일(scene file)로부터 영상을 만들어내는 과정
HTML 문서 작성을 위한 문법
여는 태그(opening tag) , <h1>~<h6>(=글씨 크기 1>2>3>~~), <p>(=띄어쓰기 O, 줄바꿈 X), <pre>(=쓴 그대로)
이것은 요소의 이름으로 구성되고, 여닫는 꺾쇠괄호로 감싸집니다. 이것은 요소가 시작되는 곳, 또는 효과를 시작하는 곳임을 나타냅니다.
닫는 태그(closing tag) , </h1>~</h6>(=글씨 크기 1>2>3>~~), </p>(=띄어쓰기 O, 줄바꿈 X), </pre>(=쓴 그대로)
이것은 여는 태그와 같지만, 요소의 이름 앞에 전방향 슬래시가 포함된다는 점이 다릅니다. 이것은 요소의 끝을 나타냅니다.
컨텐츠(content) :
이것은 요소의 내용(content)
요소(element) : <br>(=줄바꿈)
요소는 여는 태그와 닫는 태그, 그리고 컨텐츠로 이루어집니다.
++
html 5사용 시 맨 위에
<!doctype html>라고 적으면 된다.
HTML 기본틀
<!DOCTYPE HTML>
<html>
<head>
</head>
<body>
</body>
</html><head> </head> : html파일에 대한 설정이나 css, javascript 같은 코드가 들어가는 곳
<body> </body> : html파일이 웹페이지가 보여지는 부분
head 태그
(1) link tag
- css 파일을 연결하는 태그
ex)
<link rel="stylesheet" type="text/css" href="CSSTEST.css">(2) meta tag
- 문서의 정보를 담고있는 태그
ex)
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"><meta charset="UTF-8">(렌더링을 UTF-8로 설정)
<meta name="viewport" content="width=device-width, initial-scale=1.0">(페이지를 화면크기에 맞게 보여줌)
width=device-width :페이지의 너비를 기기의 스크린 너비로 설정
initial-scale=1.0 : 원래의 크기로 사용한다는 의미이다.
minimum-scale :축소했을때의 최소로 축소 가능한 수치
maximum-scale : 확대했을때의 최대로 확대가능한 수치
user-scalable : 사용자의 확대/축소 기능을 설정, 기본값은 yes이다.
(3) style tag
- html 파일 안에다가 css코드를 넣는 태그
<style>
p {color:red}
</style>
(4) script tag
- script코드를 넣는 태그
<script>
alert("helloworld");
</script>
(5) title tag
- 웹 페이지의 제목을 정해주는 태그
<title>
제목이다.
</title>
<만든작품(?)>
