Web Basic/HTML

HTML 첫 시작

Jaka_Park 2024. 3. 18. 17:45

목차

1. HTML 이란?

2. HTML 문법

3. HTML의 태그

4. Tag 속성

 


1. HTML 이란?

HTML 은 Hypertext Mark-up Language 의 약자로 웹페이지를 표시하기 위한 마크업 언어이다.

(1980년도 팀버너스리에서 만들어짐)

 

2. HTML 문법

HTML은 컴퓨터 언어 중 가장 간단한 언어에 속한다. HTML 을 할줄 알기위해서는 태그(Tag)라는 것들 알아야하는데 다음 목차에서 알아보기로 하고 지금은 기본문법을 알아 볼것이다.

 

보기 예시

<Tag> 내용 </Tag>

 

HTML의 문법은 보기와 같이 꺾쇠괄호 안에 tag를 취하는 방식을 사용하고 있으며 왼쪽에 <tag> 부분을 '여는 태그', </tag>를 '닫는 태그' 라고한다. 기본적으로 여는 태그, 닫는 태그가 원칙이지만 그렇지 않은 문법도 있으며 이에 대해서는 다음 단원에 알아보기하자.

 

3. HTML의 태그

 

Tag 이름

Tag의 이름을 알기 전에 두가지 Tag에 대해서 알아보자

Tag는 두가지로 나뉜다. Inline(인라인)과 Block(블록)이다.

 

Inline (인라인) Block (블록)
Text가 채워진만큼의 영역을 차지함 웹브라우저상 한 줄 전체를 차지함

 

html : html 을 쓰기위해 꼭 필요한 tag이며, 필수로 head 태그와, body 태그가 필요하다.

head : 화면에 보이지 않는 영역을 다루는 태그. 안에 쓰는 태그로는 title이 있다

(title : 웹페이지의 제목을 나타냄.)

body : 브라우저상 화면에 보이는 것들을 담는 태는

 

h1~h6 : 제목을 나타내는 태그. 굵은 글씨로 나타나며 숫자가 커질수록 글씨 크기가 기본적으로 작아진다.

div : 구역을 나누는 태그

p : 문단을 나눌 때 쓰는 태그이다. div와 같은 능력을 지니고 있다.

span : 인라인 태그

 

ul : 주로 카테고리를 분류할 때 사용

     li : ul 태그 안에 반드시 써야하는 태그이다.

 

form : 입력받은 값들을 서버로 전송해주는 태그

    안에 쓰는 태그로는 input과 button 이 있다.

 

- 기본적으로 태그는 여는태그 닫는태그가 필요하지만 예외도 있다.

밑에 태그는 닫는 태그 없이 사용한다.

 

br : 텍스트 한 줄 띌 때 사용

input : 값을 입력 받을 때 사용

 

 

4. Tag 속성

속성 예시 <input 속성="">

 

- input 속성

type

 - text, password, radio, checkbox, button, submit, placehodler 등등 

value