티스토리 뷰

it&ai/web

④ 웹사이트 만들기 HTML 제목

레이나sy 2021. 7. 28. 09:00
반응형

 

저번시간까지해서 html의 기본과 주석넣는 방법에 대해서 이야기를 했다면 오늘 부터는 html태그에 대해서 이야기를 하려고한다. 그중 웹브라우저에 노출이 되는 body태그 영역 안에서 내가 태그를 활용해 짠 코딩이 어떻게 브라우저 상에 노출이 되는지 확인해보려고한다.

 

 

 

 

 

그중 첫번째가 되는 <hn>태그에 대해서 이야기를 하려고 한다. 이태그는 태그는 제목을 나타내는 태그이며, 첫번째라 이야기를 하는이유는 개인적으로 나는 웹페이지를 작성하는것을 웹문서 즉 글을 작성한다고생각한다. 글을 작성하는것이 어렵다면 책을 떠올리면된다.

 

목차- 제목 - 문단 - 문장 - 문자 이렇게 이루어져 있듯이 이순서를 참고해서 작성하면 쉽게 이해할수가있기때문이다.

이 제목태그는 heading의 H를 생각하면 되고,  n은 숫자 1~6까지 들어갈수있기에 n이라고 표시를 해두었다. 참고일뿐 코딩할대 <hn> 이라고하면 아무리 써도 오류가 날것이다. 

 

 

 

        <h1>    </h1>

        <h2>    </h2>

        <h3>    </h3>

        <h4>    </h4>

        <h5>    </h5>

        <h6>    </h6>

 

제목태그는 <h1>~<h6>

까지 구성되어있으며, 숫자가 작을 수록 중요함을 나타낸다. 사실 사이즈나 글꼴등은 나중에 다 변경가능해서 굳이 중요도를 나눌 필요가 있나 하겟지만 , 나중에 배울 시멘틱태그를 참고하면 중요할수록 숫자가 작은 제목태그를 사용해주는것이 좋으니 미리미리 습관을 들여놓는것이 좋다.

 

 

 

코드 편집기 화면

 

 

브라우저에 확인되는 화면

 

heading.html
0.00MB

 

◇ 오늘의 핵심 내용 정리 ◇
 

① 웹문서를 작성할때는 책이 작성되는 순서를 참고하면 쉽다.
② 제목태그는 <h1> ~ <h6> 까지 있으며 숫자가 작을수록 중요함을 나타낸다.

 

 

 

< 지난시간 다시 읽기 >

 

 

① 웹사이트 만들기 HTML기본

 

① 웹사이트 만들기 HTML기본

PC또는 모바일에서 이용하는 웹사이트를 만들기 위해서 기본적으로 알아야하는 언어는 두가지가있다. HTML과 CSS 이 두 언어를 알면 기본적으로 웹사이트에 내가 노출시키고싶은 정보와, 가독력

nclip.tistory.com

② 웹사이트 만들기 HTML head와 body

③ 웹사이트 만들기 HTML 주석

 

반응형
반응형