HTML 시작하기

이충희·2021년 5월 23일

웹 개발

목록 보기

2/4

1. HTML이란?

- HTML(HyperText Markup Language)
: 웹 브라우저 에서 내용을 보여주는 텍스트, 이미지, 영상 등의 위치를 표시하는 것.

2. HTML 태그 문법

1) 기본형식

(1)<태그>콘텐츠</태그>

<p>Hello World</p>

(2) <태그 속성1="값" 속성2="값">콘텐츠</태그>

<a href="https://velog.io/
        @choonghee123">충희의 블로그</a>

(3) 많은 태그 활용

<div>
  <p>Hello World!!</p>
</div>

(4) 태그만 필요한 경우

</br>
<img src="https://lh3.googleusercontent.com/GTmuiIZrppouc6hhdWiocybtRx1Tpbl52eYw4l-nAqHtHd4BpSMEqe-vGv7ZFiaHhG_l4v2m5Fdhapxw9aFLf28ErztHEv5WYIz5fA" />

(5) HTML에서의 주석

<!-- 주석입니다. -->

2) HTML 기본형식

<!DOCTYPE html>  <!--HTML5 형식의 문법으로 작성되었다는 의미-->
<html lang="ko"> <!--html에서 작성한 언어가 한국어라는 뜻. 웹 ㅏ이트에서 검색을 할 때, 한국어로 된 문서를 검색하면 <html lang="ko">로 된 문서부터 우선 검색-->
  <head><!-- head : 웹 브라우저가 웹 문서를 해석하는데 필요한 정보를 입력하는 부분-->
    <meta charset="UTF-8" /><!--해당 html문서에서 인코딩 방식을 지정-->
    <title>HTML 기본 문서</title><!--웹 브라우저의 제목-->
  </head>
  <body><!-- 웹 브라우저에서 화면을 나타내는 내용-->
    <div><!--여러 소스들을 묶을 때 사용하는 박스-->
      <h1>동아리 교육용 입니다.</h1>
      <p>HTML</p>
      <p>CSS</p>
      <p>JavaScript</p>
    </div>
  </body>
</html>

태그	내용
`<!DOCTYPE html>`	HTML5 형식의 문법으로 작성되었다는 의미
`<html lang="ko"`>	html에서 작성한 언어가 한국어라는 뜻. 웹 사이트에서 검색을 할 때, 한국어로 된 문서를 검색하면 로 된 문서부터 우선 검색
`<head>`	웹 브라우저가 웹 문서를 해석하는데 필요한 정보를 입력하는 부분-->
`<body>`	웹 브라우저에서 화면을 나타내는 태그
`<meta charset="UTF-8" />`	해당 html문서에서 인코딩 방식을 지정
`<h1>,<h2>,...<h6>`	브라우저에서 제목을 나타낼 때 사용, n의 숫자가 커질수록 글씨가 작아짐.
`<br>`	띄어쓰기, lineBreaking
`<p>`	paragraph(단락)을 의미함.
`<a>`	anchor, 다른 페이지를 연결할 때 사용하는 하이퍼링크를 정의할 때 사용함. href="링크"를 추가적으로 사용하면 됨.
`<img>`	이미지를 삽입할 때 사용, src="이미지경로"와 함께 사용함.