so woon!

html 기본 구조 (structure) 본문

HTML/개념정리

html 기본 구조 (structure)

xowoony 2022. 8. 25. 20:51

HTML 
HTML(Hyper Text Markup Language)는 마크업 언어(Markup Language)이고 자체적으로 연산이 불가능하다.
마크업 언어는 태그(Tag)등을 이용하여 문서나 데이터의 구조를 정의하는 언어이다.
태그란 문서상에서 어떠한 구성요소의 존재나 시작과 끝을 알리기위해 사용한다.  '<태그 이름>'  가 여는 태그(Opening Tag)이고,  '</태그 이름>'가 닫는 태그(Closing Tag)이다.
자동으로 닫는 태그(Self-Closed Tag)는 닫는 태그를 요구하지 않는다.
태그 이름은 대소문자를 구분하지 않지만 전체 소문자로 작성하는 것이 표준.

시멘틱(Semantic) : 검색 엔진(Search Engine)이나 TTS(Text-To-Speech)로 하여 어떠한 태그의 내용이
                                의미를 가지는가에 대한 여부
속성(Attribute) : 말그대로 태그의 속성. 여는 태그안에 '속성 이름="속성 값"' 형식으로 적는다.
                         속성 값은 반드시 텍스트이고, 숫자나 기타 타입으로 적지 않는다.
요소(Element)의 구조와 존재를 정의한다.

 


기본 구조
  <사람>
      <머리>
             <눈 크기="큼"></눈>
             <눈></눈>
             <코></코>
             <입></입>
      </머리>
        <상체>
              <팔></팔>
        </상체>
        <하체>
           ...
        </하체>
</사람>

<!DOCTYPE html>
<html lang="ko">
    <head>
        <meta charset="UTF-8">
        <title>문서의 제목</title>
    </head>
    <body>

    </body>
</html>


  <머리>, <상체>, <하체> 태그는 <사람>태그의 자식(Child)
  <눈>, <코>, <입> 태그는 <머리>태그의 자식이고 <사람>태그의 자손(후손, Descendant)이다.
  <사람> 태그는 <머리>, <상체>, <하체> 태그의 부모(Parent)이다.
  <사람> 태그는 <눈>, <코>, <입> 태그의 선조(Ancestor)다.
  <입> 태그는 <눈> 태그의 형제(Sibling)이고, <코> 태그의 인접 형제(Adjacent Sibling)이다.
  엄밀히 얘기해서, <눈> 태그를 <입> 태그의 형제라고 하지 않는다.

문서 최상단에 해당 문서의 종류와 HTML 몇 버전의 표준을 준수하고 있는가에 대한 정보를 아래와 같이 적는다.
     <!DOCTYPE html> : HTML 문서이고, HTML 최신 버전(5)의 표준을 준수하는 페이지이다.
     <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> :
     HTML 문서이고 HTML 4버전을 준수하는 페이지이다.

기타
  두 번 이상 연속된 띄우기( )는 하나로 인식된다. 만약 두 번 이상 띄우기가 유효해야하는 경우  '&nbsp;'를 사용하면 된다.
  이 약속어 하나는 띄우기 하나로 인식 됨. (Non-breaking Space)
  꺽쇠 괄호(<, >)는 각 &lt;와 &gt;로 표시한다. (Less-than, Greater-than)


MDN(Mozilla Developer Network) : HTML 태그 공부하기 좋음.  





 

저작자표시 비영리 변경금지

'HTML > 개념정리' 카테고리의 다른 글

tag (br)  (0) 2022.08.25
tag (b), tag (strong)  (0) 2022.08.25
tag (i), tag(em)  (0) 2022.08.25
tag (head, title, meta, body)  (0) 2022.08.25
tag (html)  (0) 2022.08.25
'HTML/개념정리' Related Articles more
Comments