본문 바로가기

HTML5 & CSS

HTML5&CSS3 기초 2강

HTML 태그, 속성 및 전체적인 구조

HTML 문서는 '태그'로 구성

HTML 문서의 뼈대는 HTML, head, body로 구성

body 태그 안에 실제 웹문서에 표현되는 수많은 태그가 들어간다.

n개의 태그가 모여 웹문서가 된다.

태그는 시작태그와 종료태그 </>로 구성되고 태그는 속성을 가진다. (종료태그가 없는 태그도 있음)

<a href="http://google.com"> 구글로 가기 </a>

a는 태그, href는 속성. ""안에 들어가는 건 속성값.

<br />는 개행을 해주는 태그인데 종료태그가 따로 없음(나홀로 태그)

<hr />는 내용구분을 짓는 구분선


주석

HTML 문서가 브러우저를 통해 출력될 때 노출되지 않는 것으로 프로그래밍 설명문. 추후 발생되는 디버깅, 유지보수에 대한 가이드

<!-- -->


HTML 문서 구조

DOCTYPE, html, head, meta, title, body로 구성

html안에 head와 body가 속하며 head 안에 meta, title이 속한다.

meta 문서에 사용된 문자에 대한 스펙정보

tiltle은 홈페이지 최상단에 나오는 홈페이지 이름. 작성하지 않아도 상관없음.


<head> 태그 : 주로 웹 문서를 정의하는 내용 기술

<body> 태그 : 웹 문서의 내용 기술


텍스트관련 태그

웹 문서 : 주로 텍스트와 이미지로 구성된다.

<h1> ~ <h6> 및 <p> 태그가 가장 많이 사용된다.

h1이 가장 큰 글씨, h6이 가장 작은 글씨. 텍스트를 주로 쓰지만 이미지, 동영상도 들어갈 수 있다.

<p>태그는 문단태그

 "utf-8"은 한글, 영어 한자, 일어 등을 지원한다.


하이퍼링크 태그

웹문서의 꽃인 앵커 태그를 가지고 있는 속성

<a> 태그 : 웹 문서를 이동한다. 웹 서비스의 가장 중요한 요소

href 속성 : 이동할 주소를 속성값으로 갖는다. 제일 중요한 속성

<a href = "http://google.com" target="_blank" >go google </a><br />

target에는 새 창으로 열리게 하는 blank , 자기 자신에서 여는 self. self는 디폴트값이므로 안써도 상관없다.


아이디속성을 특정위치로 이동

태그의 아이디 속성을 이용한 페이지 내에서 특정 위치 이동

<hr id = "info01"/> &nbsp; &nbsp;

<p> <a href="#info01">


&nbsp;는 띄어쓰기 1칸

#은 id를 뜻한다


반응형

'HTML5 & CSS' 카테고리의 다른 글

HTML5&CSS3 기초 4강  (0) 2016.05.19
HTML5&CSS3 기초 4강  (0) 2016.05.18
HTML5&CSS3 기초 3강  (0) 2016.05.18
T아카데미 온라인 교육 HTML5&CSS3 기초 1강  (0) 2016.05.01