프루트 2022. 5. 19. 17:27

HTML이란?

- HT : HyperText, 문서와 문서가 링크로 연결되어있다.

- M : Markup, 태그로 이루어져 있다.

- L : Language, 언어

 

태그(tag)

- 태그는 시작태그와 종료태그의 조합으로 이루어져 있다.

- 형식은 <tag></tag> 이며, 종료태그가 없는 태그도 있다. ex) <br>, <img> 등...

속성(attribute)

- 시작태그에 필요에 따라 속성을 작성하며, 사용할 수 있는 속성은 태그마다 다를 수 있다.

- 여러 개의 속성 선언 시 속성과 속성 사이에는 공백으로 구분하여 지정해야 한다.

요소(element)

- 태그를 사용해 만들어진 객체를 요소라고 한다.

 

태그의 종류

 - <head>,<body>

   1. <head>요소에는 문서의 메타데이터 집합 요소로, 문서 제목, 스타일 파일 연결 등을 위한 요소들을

    포함할 수 있다.

   2. <body>요소는 문서의 본문 요소로, 실제 웹 브라우저에 보여지는 컨텐츠들을 포함한다.

 - <meta>,<title>

   : 다양한 문서의 정보를 지정할 때 사용한다.

 - <h1>~<h6>

   : 제목을 작성하고자 할 때 사용하며, h1에서 h6로 갈수록 글자의 크기가 작아진다.

 - <a>

   : 텍스트나 이미지에 링크를 설정할 때 사용하며, 사용 형식은 다음과 같다.

    <a href="파일명 또는 url" title="대체설명">텍스트 또는 이미지</a>

 - <p>

   : 텍스트를 문단으로 정의할 때 사용하며, 이 태그 안에는 인라인 요소와 텍스트만 포함할 수 있다.

 - <address>

   : 이 태그를 이용하여 웹 문서의 아래쪽에 제작자, 저작권등의 정보를 표시할 수 있다.

     p태그와 마찬가지로 인라인 요소와 텍스트만 포함가능하며, 블록요소는 포함할 수 없다.\

 - <img>

   : 이미지를 삽입할 때 사용하며, alt속성을 이용하여 이미지가 보이지 않는 환경에서 대체 텍스트를

     작성해 이미지와 동등한 정보를 제공해야 한다.

     <img src="이미지주소" alt="대체텍스트"> 

     이미지 주소로는 절대경로(http://~~), 상대경로(./images/a.jpg)의 방법을 이용한다.

     상대경로 사용 시 .과 /이 사용되는데 현재 파일보다 상위 경로로 이동하기 위해서는 ../과 같은 방법을       사용한다.

 - <audio>

    : 오디오를 삽입할 때 사용하며, 형식은 아래와 같다.

     <audio src="오디오주소" controls="재생도구 출력 지정" ></audio>

      각 웹브라우저마다 지원하는 형식이 달라 문제 해결을 위해 mp3,ogg,wav형식을 모두 작성하면 해결        할 수 있다.

      자동으로 재생하기 위해서는 autoplay 속성을 사용하고, 반복재생을 하려면 loop 속성을 사용한다.

 - <video>

    : 비디오를 삽입할 때 사용하며, 유튜브 영상을 삽입하고 싶을때는 <ifram>태그를 사용한다.