본문 바로가기

카테고리 없음

HTML 5에 대하여 알아보겠습니다.

HTML은 Hyper Text Markup Languag의 약자입니다. 

태그로 이루어진 웹의 가장 기본적인 언어죠. 
5는 HTML의 다섯 번째 버전이라는 의미입니다.
그러니까 바로 이전의 버전은 HTML 4라는 거죠.
 
태그는 < > 구조로 되어 있습니다.
< >로 시작해 </ >로 끝나죠.
 
구글의 메인 화면을 예로 들어볼까요?

구글의 메인 화면입니다.
그러면 구글 메인 화면의 구조를 볼까요?
 
<!doctype html>
<html>
  <head>
    <meta charset="utf-8">
    <title>새 탭</title>
    <style>
      body {
        background: #FFFFFF;
        margin: 0;
      }

      #backgroundImage {
        border: none;
        height: 100%;
        pointer-events: none;
        position: fixed;
        top: 0;
        visibility: hidden;
        width: 100%;
      }

      [show-background-image] #backgroundImage {
        visibility: visible;
      }
    </style>
  </head>
  <body>
    <iframe id="backgroundImage" src=""></iframe>
    <ntp-app></ntp-app>
    <script type="module" src="new_tab_page.js"></script>
    <link rel="stylesheet" href="chrome://resources/css/text_defaults_md.css">
    <link rel="stylesheet" href="shared_vars.css">
  </body>
</html>
 
이렇게 되어있습니다. 
 
그럼 구글 메인 화면의 구조를 알아보겠습니다.
시작은 
<!doctype html>로 시작합니다.
이건 HTML의 문서 타입을 의미합니다. HTML 5로 매우 간단하게 정의되는 것으로 바꼈습니다.
 
<html>은 html의 시작을 의미하며, 가장 아랫쪽의 </html>은 html이 끝난다는 의미입니다.
모든 태그는 이 <html>과 </html> 사이에 존재합니다.
<head>와 </head> 사이에는 html 문서의 제목이나 설명 등이 들어가며, 문서에 적용된 스타일이 정의됩니다.
<body>와 </body> 사이에는 본문에 표시될 내용이 작성됩니다.