HTML 이란? 기초 정리편

HTML은 프로그래밍 언어가 아니며,

컨텐츠의 구조를 정의하는 마크업 언어입니다.

HTML은 컨텐츠를 어떻게 보이게할 것인가에

대한 방식을 마크업으로 표시하며 특정한 방식으로

동작하도록 하는 일련의 요소(elements)로 구성되어 있습니다.

 

한 가지 예를 들어보겠습니다.

<p> The Kan </p>

(p는 paragraph(문단)를 의미합니다)

 

1. <p> -> opening tags(여는 태그)

2. The Kan -> contents

3. </p> -> closing tags(닫는 태그)

 

opening tags, contents, closing tags는

앞서 말씀드린 요소를 구성합니다.

 

요소는 속성을 가질 수 있습니다.

<p class="editor-note"> The Kan </p>

class 속성이 The Kan을 어떤 스타일을 결정하는데

사용될 수 있습니다.

 

속성은 1. 요소이름(ex class) 2. =  3. " or '  로 꼭 이루어져야 합니다.

 

이미지

 

<img src=images/apple.jpg alt="This is apple image">

 

img는 html에 이미지를 표시하는데 사용하는 태그입니다.

컨텐츠가 없고, 단순히 이미지만을 불러오기 때문에 닫는 태그가

존재하지 않습니다.

src(source) - 이미지가 존재하는 경로

alt(alternative) - 이미지가 보이지 않는 경우, 시각 장애인의 경우

image를 대신하여 읽어주는 속성으로 사용됩니다.)

 

 

문자 나타내기

 

<h1></h1>

.

.

.

<h6></h6>

총 6가지가 있으며 h1의 문자 크기가 가장 큽니다.

 

 

목록

 

<ul></ul> (unordered list) 순서가 필요없는 목록

 

<ol></ol> (ordered list) 순서가 있는 목록

 

각 태그안의 항목들은 <li> (list item) 태그를 사용합니다.

 

ex)

<ol>
   <li>American</li>
   <li>Hong Kong</li>
   <li>Canada</li>
   <li>Germany</li>
</ol>

 

 

연결

 

<a> (anchor) 태그를 사용합니다.

 

<a href="https://www.naver.com"> This is naver </a>

href -> hypertext reference