1. HTML 기본
tag와 속성
class
tag에 적용할 스타일의 이름 지정
dir
내용의 텍스트 방향을 지정 왼쪽 >> 오른쪽(기본값, ltr) 오른쪽 >> 왼쪽(rtl)
id
tag에 유일한 ID를 지정함. 자바스크립트에서 주로 사용.
style
인라인 스타일을 적용하기 위해 사용
title
tag에 추가정보를 지정. tag에 마우스 포인터를 위치시킬 경우 title의 값 표시
Root 요소
<html> tag는 HTML 문서 전체를 정의
Head와 Body로 구성
Head 요소
문서 머리글, 제목
<head> tag는 브라우저에게 HTML문서의 머리 부분임을 인식.
<title>, <meta>, <style>, <script>, <link> tag를 포함 가능.
<title> tag는 문서의 제목을 의미, 브라우저 제목 표시줄에 tag내용이 나타남
<title> tag 이외의 다른 tag로 표현한 정보는 화면에 출력X
메타데이터
문서의 작성자, 날짜, 키워드 등 브라우저의 본문에 나타나지 않는 일반 정보를 나타냄
name과 content 속성을 이용하여 다양한 정보를 나타냄
http-equiv 속성을 이용하여 인코딩 설정 및 문서 이동, 새로 고침이 가능
charset 속성을 이용하여 문서의 인코딩 정보를 설정
<meta name = "name" content = "value">
<!-- name 속성 : description(문서의 요약), keyword(검색어 입력, 콤마로 분리), author(제작자) 등-->
<meta name = "description" content = "간단한설명.">
<!-- 페이지 설명, 검색엔진 로봇이 수집 -->
<meta name = "keyword" content = "html5, web">
<!-- 페이지의 키워드를 ,로 구분해서 나열, 검색엔진 로봇이 수집 -->
<meta name = "author" content = "troment">
<!-- 페이지 제작자 정보. -->
<meta http-equiv = "refresh" content = "30">
<!-- http-equiv 속성 : refresh(문서를 자동으로 업데이트), content-type(인코딩 설정) 등.
<meta charset = "UTF-8">
<!-- 인코딩 정보를 설정 -->
Body 요소
웹브라우저에 보여질 문서의 내용을 작성
<head> tag 다음에 위치하고 <head> 내부에 위치하는 tag와 <html>을 제외한 모든 tag
id 속성을 이용하여 문서 내에서 tag를 유일하게 식별 가능
class 속성을 이용하여 여러 tag에 공통적인 특성을 부여
<section> tag를 이용하면 같은 tag를 서로 다르게 표현
문서 구조를 <section> tag를 이용하여 구분하면 각 문단의 제목을 하나의 tag로 작성가능
특수문자
-   : 공백
- < : <
- > : >
- & : &
- " : "
- © : copyright
- ® : registered trademark
'FRONT-END > HTML' 카테고리의 다른 글
Semantic (0) | 2021.12.07 |
---|---|
HTML 마크업 요소 (0) | 2021.12.07 |