HTML

Posted on | In | 0 comments

HTML이란?

HTML은 하이퍼텍스트 마크업 언어(HyperText Markup Language, 문화어: 초본문표식달기언어, 하이퍼본문표식달기언어)라는 의미의 웹 페이지를 위한 지배적인 마크업 언어다. HTML은 제목, 단락, 목록 등과 같은 본문을 위한 구조적 의미를 나타내는 것뿐만 아니라 링크, 인용과 그 밖의 항목으로 구조적 문서를 만들 수 있는 방법을 제공한다. 그리고 이미지와 객체를 내장하고 대화형 양식을 생성하는 데 사용될 수 있다. HTML은 웹 페이지 콘텐츠 안의 꺾쇠 괄호에 둘러싸인 “태그”로 되어있는 HTML 요소 형태로 작성한다. HTML은 웹 브라우저와 같은 HTML 처리 장치의 행동에 영향을 주는 자바스크립트와 본문과 그 밖의 항목의 외관과 배치를 정의하는 CSS 같은 스크립트를 포함하거나 불러올 수 있다. HTML과 CSS 표준의 공동 책임자인 W3C는 명확하고 표상적인 마크업을 위하여 CSS의 사용을 권장한다. - 위키 백과-

HTML 기본구조

<!DOCTYPE html>
<html>
<head>
  <!-- head : 문서에 직접적으로 보이지 않는 정보를 브라우저에 제공 -->
  <meta charset="UTF-8">
  <title>브라우저 제목표시줄</title>
</head>
<body>
<!-- body : 사용자에게 보여지는 정보 -->
 <!-- 주석 -->

</body>
</html>

HTML 태그의 구성

<요소 속성="값"></요소>
<a href="http://www.naver.com">네이버</a>

절대경로와 상대경로

  • 절대경로는 http://와 https://로 시작하는 것
  • 상대 경로는 HTML 파일을 기준으로 한 경로
    • ../ 상위 폴더로
    • / 가장 회상위 폴더부터 시작

블록요소

  • 줄 바꿈이 일어나는 형태
  • ex) h1, p, div

인라인 요소

  • 줄바꿈이 일어나지 않는 형태
  • 블록요소는 인라인 요소를 포함 가능하지만 인라인 요소는 블록 요소 포함 불가능
  • ex) a, span

레이아웃 요소

  • div, span
  • 블록과 인라인 방식의 레이아웃 구현하는데만 사용

태그 요소

  • 줄바꿈 : p, br 태그
  • pre태그 : 엔터키가 유지가 됨
  • 링크 : a
    • href: 이동할 페이지 주소
    • target: 링크 걸린 페이지 여는 방법( _self, _blank:새창)
    • title: 마우스 올렸을 때 보여주는 제목
  • label
  • select

편하게 사용하기

  • ol>li{항목}*[tap]