프론트엔드에서 가장 기본적으로 알아야할건 바로 HTML이다.
웹분야로 가려면 이 HTML은 기본적으로 알아야한다.
HTML5 설정
html5를 사용하려면 문구 제일 위에다가
<!doctype html> 이라고 적으면 된다.
그럼 html5를 사용할 준비가 되었다는 뜻이다.
HTML기본틀
<!DOCTYPE HTML>
<html>
<head>
</head>
<body>
</body>
</html>
<head>
</head>
이태그는 html파일에 대한 설정이나 css,javascript 같은 코드가 들어가는 곳이다
<body>
</body>이태그에는 html파일이 웹페이지가 보여지는 부분을 태그로써 구현하는 곳이다.
주석
주석을 달아줄 때는 이것을 사용한다.
<!--여기에다가 주석문구를 넣어주세요-->head태그
link태그
css 파일을 연결하는 태그이다
기본 사용방식은 이러하다
<link rel="stylesheet" type="text/css" href="CSSTEST.css">meta 태그
문서의 정보를 담고있는 태그이다.
<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이다.
style태그
<style>
p {color:red}
</style>html 파일 안에다가 css 코드를 넣는 태그이다.
자세한 css문법은 CSS편에서 다룰 예정이다.
script태그
<script>
alert("helloworld");
</script>script코드를 넣는 태그이다. 여기에다가 script 코드를 넣어주면 된다.
title태그
웹페이지의 제목을 정해주는 태그이다.
<title>
제목이다.
</title>