02. 문법

SEHEE Y00N·2023년 7월 23일

HTML 기본 문법

  1. 모든 HTML 태그는 '<' 괄호로 시작, '>'로 끝난다.
  2. 대부분의 태그는 '여는태그' 와 '닫는태그'로 구성된다.
    **닫는 태그에는 / 가 들어간다 (예 : , 등
  3. 모든 태그는 속성을 가질 수 있다.
    여는 태그의 태그명 뒤에만 넣을 수 있다.
    ex) <태그명 속성명="속성값" 속성명="속성값" 속성명="속성값"... ...> </태그명>
  4. 대표적으로 사용하는 속성명
    -- id : 한 웹 문서에서 하나만 존재 가능
    -- class : 한 웹문서에 여러 개 존재 가능
    -- style : 요소에 직접(인라인 방식) css를 적용

레벨

  1. inline : 요소의 필요 크기만큼만 영역을 잡는다.
    별도의 사이즈를 줘도 무시
    옆으로 나열됨
    대표적인 인라인 레벨 태그 : span

  2. block : 기본 가로는 가능한 끝에서부터 끝까지 잡는다.
    세로로 나열됨.
    기본 세로는 필요크기만 잡는다.
    별도의 사이즈를 주면 적용
    대표적 블록 레벨 태그 : div

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>문법</title>
</head>
<body>
  <div id="box1 class="box1> div태그1 </div>
  <div id="box1 class="box1> div태그2 </div>
  <div style="width: 100px; height: 100px; background-color: red;"> div 태그3 </div>
  
  <span style="width: 100px; height: 100px; background-color:blue;">span1</span>
  <span>span2</span>
  <span>span3</span>
  <span>span4</span>
  </body>
  </html>

0개의 댓글