나의 미래에 대해 고민하던 중 개발자의 길을 걷기로 하였다.
새로운 공부를 위하여 부트캠프를 여기저기 알아보다가 위코드로 결정을 하였고
첫 사전스터디가 시작되었다. 1주차 과제는 html, css를 이용한 자기소개 웹페이지 만들기였다.
차근차근 공부를 시작하기로 하여 그 기록을 Velog에 남기기로 하였고,
모든 웹의 기초가 되는 HTML부터 배워나가려고 한다.
오늘의 포스트는 HTML의 기본구조로 공부를 남겨보려 한다.
태그는 < 와 > 로 묶인 부분을 의미한다.
태그는 소문자로 써야 한다.
여는 태그와 닫는 태그를 정확히 입력해야 한다.
<h3>글자의크기와굵기</h3>
<p>하나의문단구분</p>
태그는 속성과 함께 사용할 수 있다.
예를 들어 이미지 파일을 삽입할 때는 이미지, 'image'의 약자인 'img'를 <와>사이에 넣어서 <img>
라는 태그를 사용한다. 이때 <img>
라는 태그는 이미지 파일을 삽입해야 이미지를 나타낼 수 있기 때문에 파일의 경로를 알려주는 src속성이 필요하다. 이미지의 크기를 조절하기 위해서는 width속성, height속성도 함께 사용된다.
<img src="이미지파일경로.jpg" width="원하는크기" height="원하는높이">
HTML문서는 정해진 형식에 맞추어 내용을 입력해야 한다. 소스가 짧든 길든 반드시 필요한 구조는 포함시켜야 한다.
<!DOCTYPE html>
<html>
<head>
<title>브라우저 창에 표시되는 문서 제목</title>
</head>
<body>
</body>
</html>
<!DOCTYPE html>
: 현재 문서가 HTML5 언어로 작성된 웹문서라는 뜻이다.
<html>~</html>
: 웹문서의 시작과 끝을 나타내는 태그이다.
<head>~</head>
: 웹 브라우저가 웹 문서를 해석하기 위해 필요한 정보를 해석하기 위해 필요한 정보를 입력하는 부분이다. 실제 문서 내용이 아니기 때문에 문서 제목만 브라우저 창에 표시되고 나머지는 표시되지 않는다.
<body>~</body>
: 실제로 웹 브라우저 화면에 나타나는 내용이다. HTML 태그들은 대부분 <body>
태그안에 들어간다.