KDHzoot's Github

Code for study, project, etc

자세히보기

카테고리 없음

html 개론

kdhzoot 2018. 3. 27. 00:54

앞서 말했 듯이 공부할 내용은 html5이다. 기본적인 틀은 다음과 같다.


1
2
3
4
5
6
7
8
9
10
<!DOCTYPE html>
<html>
<head>
    <title>test html file for CoMenTo</title>
</head>
<body>
    <!-- this is jueseok -->
    <h1>hello html5</h1>
</body>
</html>
cs


<!DOCTYPE html>로 시작하여 문서 형식 지정

<html>사이에 <head>와 <body>기재

<head> : 문서제목, 외부파일 참조, metadata의 설정 등

<body> : 웹에 출력되는 요소들



다양한 IDE가 있지만 나는 sublime3를 사용한다.




1. 요소


<태그>콘텐츠</태그>

<p>Hello world</p>


앞에오는 요소는 시작태그이고 뒤에오는 요소는 종료태그이다.

html은 이러한 요소들의 집합으로 이루어져있다.


요소들은 서로 중첩될 수 있으며 다른 요소를 포함할 수 있다. 

이를 부자관계라 부르며 c언어에서 {}로 블럭을 표시하는 것과 같다.


content가 없는 요소는 빈요소라 부르며 attribute만 가질 수 있다.

<meta charset="utf-8">

빈요소 : br, hr, img, input, link, meta




2. 어트리뷰트

요소의 성질, 특성을 정의하는 명세.

추가적인 정보를 요소에 전달.

<태그 attribute="value">


글로벌 어트리뷰트

: 모든 요소에서 공통으로 사용할 수 있는 attribute


 attribute

설명 

 id

 유일한 식별자를 요소에 지정

 class 

 스타일시트에 정의된 class를 요소에 지정 

 hidden 

 의미상으로 브라우저에 노출되지 않게함

 lang

 언어를 지정 

 style 

 스타일 지정 

 tabindex 

 키보드로 페이지 내비게이션 시 이동 순서 지정 

 title

 요소에 대한 제목 지정 




3. 주석

: 주로 개발자가 코드를 설명하기 위해 사용됨 컴파일 시 무시

<!-- 주석 -->