제목 태그 : 제목 입력 시 사용

형식

 <h1>문자열</h1>
 <h2>문자열</h2>
 <h3>문자열</h3>
 <h4>문자열</h4>
 <h5>문자열</h5>
 <h6>문자열</h6>

 

참조

 h1~h6까지 있음

 body 태그 안에서 쓰인다.

 

예제

<h1>H1 Tag</h1>
<h2>H2 Tag</h2>
<h3>H3 Tag</h3>
<h4>H4 Tag</h4>
<h5>H5 Tag</h5>
<h6>H6 Tag</h6>

 

실행화면

 

 

 

본문 태그

 p : 단락을 만드는 태그

 br : 줄 바꾸기 태그

 hr : 수평선을 긋는 태그

 pre : 글자, 글꼴, 줄 바꿈을 입력한 그대로 출력하는 태그

 

참조

 body 태그 안에서 쓰인다.

 

예시

<p>p tag 입니다</p> 

<hr>	<!-- 수평선 -->

<br>	<!-- 줄바꿈 -->

<pre style="font-size: 200%; background-color: #ffff00; font-family: verdana">
안녕하세요!
반갑습니다.
비가 오는군요.
</pre>

 

실행 화면

 

 

 

앵커(Anchor) 태그 : 서로 다른 웹페이지 사이를 이동하거나 웹페이지 내부에서 특정한 위치로 이동할 수 있는 태그(하이퍼링크)

기본 형식

  <a href="주소">문자열</a>

 

참조

 body 태그 안에서 쓰인다.

 참조할 주소가 없을 경우(빈 링크) 주소 입력에 #을 입력합니다.

 

예시

<!-- 구글로 이동하기 -->
<a href="http://www.google.com">구글로 이동</a>
<!-- 참조 주소 없음 -->
<a href="#">참조 주소 없음</a>

 

a 속성 & 속성 값

 target : 링크된 문서를 클릭했을 때 문서가 열릴 위치를 명시

 target 속성 값 : self (클릭 시 현재창에서 이동)

                               _blank (클릭시 새창으로 이동)

                                _top (다운로드 속성: 파일 다운로드)

 

예시

<!-- 구글로 이동하기 -->
<a href="http://www.google.com" target="_blank">구글로 이동</a>

<a href="http://www.google.com" target="_self">구글로 이동</a>

<a href="파일경로" target="_top">파일 다운로드</a>

 

 

 

글자 태그

 b : 굵은 글자

 strong : 굵은 글자

 u : 밑줄 글자

 ins : 밑줄 글자
 i : 기울어진 글자

 em : 기울어진 글자

 small : 작은 글자

 sub : 아래에 달라붙는 글자

 sup : 아래에 달라붙는 글자

 del : 가운뎃줄이 그어진 글자

 mark : 배경이 노란색(강조) 글자

 

참조

 body 태그 안에서 쓰인다.

 

예시

<p><b>b(굵은) </b> 텍스트</p>
<p><strong>strong(굵은) </strong> 텍스트</p>
<p><u>u(밑줄) </u> 텍스트</p>
<p><ins>ins(밑줄) </ins> 텍스트</p>
<p><i>i(기울어진) </i> 텍스트</p>
<p><em>em(기울어진) </em>텍스트</p>
<p><small>small(작은) </small> 텍스트</p>
<p><sub>sub(아래첨자) </sub>텍스트</p>
<p><sup>sup(윗첨자) </sup>텍스트</p>
<p><del>del(가운데줄) </del>텍스트</p>
<p><mark>mark(강조) </mark> 텍스트<p>

 

실행화면

+ Recent posts