[HTML] 기본태그

HTML 2014. 7. 8. 09:00

▶문서 배경 태그의 사용법

    <body bgcolor="색상"   background="이미지 주소"   text="색상"   link="색상" vlink="색상" alink="색상">

  • <body bgcolor="색상">                  : 윈도우 배경화면색 지정.
  • <body background="이미지 주소">  : 배경을 그림으로할때 쓰는 속성.
  • <body text="색상">                        : 표준 글씨색 지정.
  • <body link="색상">                        : 링크 부분의 색 지정.
  • <body vlink="색상">                      : 검색한 링크 부분의 색 지정.
  • <body alink="색상">                      : 링크된글자를 누르는순간의 색을 지정.

▶<P> 태그의 사용법

  • <P> 내용 </P> : 문단을 나누는 태그입니다.

▶빈칸 사용하기  

  • &nsp; : 빈칸을 만들어 줍니다.(빈공간,글씨의 공란을 대신함.)

▶주석 사용하기

  • 한 줄을 주석으로 사용할 때는 <! 주석> 태그를 이용하고 여러줄을 주석으로 이용하려면 <!-- , //--> 태그를 이용합니다.
  • 주석태그는 브라우져에서는 보이지 않는 태그입니다.

▶<br> 사용하기

  • <br> 태그는 줄을 바꾸고 싶을 때 사용하는 것입니다.
  • 여러줄을 띄우고 싶을 때는 br 의 횟수를 더 많이 해주면 됩니다.

▶문단 정렬하기

  • <p align="정렬형태"> : left 나 right 를 써서 줄 단위로 정렬합니다.
  • <center></center> : 여러문단을 중앙 정렬합니다.

▶선 태그 사용하기

  • <hr size="크기" width="크기" align="정렬형태" style="color:색상;" noshade>
  • 수평선 그리기 태그입니다.
  • size : 픽셀 단위의 선의 두께입니다.
  • width : 선의 수평길이 입니다.
  • align : 길이가 화면보다 작을 때 수평선이 그려질 위치입니다.
  • noshade : 음영 효과 없는 보통의 선 그리기 입니다.
  • style="color:색상;" : 선의 색상을 바꿔줍니다.

▶글자 크기 변경

  • <basefont size="크기"> : 전체 글자 크기를 지정.
  • <font size="크기"> : 일부의 글자 크기를 변경.

▶글자색 변경

  • <font color="색상"> : 글자의 색상 지정.

▶글꼴 변경

  • <font face="글꼴명"> : 글꼴 지정.
  • <font size="크기" color="색상" face="글꼴"> :  글자의 크기와 색상,글꼴을 동시에 바꿈

▶글자 모양 정리

    태그

    관용적 표현(결과)

    <i>내용 <i>
    <em>내용</em>
    <dfn>내용</dfn>
    <var>내용</var>
    <cite>내용</cite>

    이탤릭체 모양

    <b>내용</b>
    <strong>내용</strong>

    진한 모양

    <tt>내용</tt>
    <code>내용</code>
    <samp>내용</samp>
    <kbd>내용</kbd>

    타자체
    courier 체로 표현.

▶입력된 그대로 출력하기

  • <pre>내용</pre> : 화면에 나와 있는 내용을 그대로 출력합니다.

▶그림 삽입하기

    <img src="이미지 파일 경로(주소)" alt="그림 설명"

        align="top | bottom | middle | left | right | texttop | absmiddle | baseline | absbottom | "

            width="가로크기" height="세로크기"   border="이미지 테두리 두께"  hspace="좌우여백" vspace="상하여백">

  • alt ="그림설명"  : 그림의 설명을 삽입합니다.
  • width="가로크기" height="세로크기"  : 그림을 자신이 원하는 크기만큼 조정합니다. 숫자가 높을 수록 커집니다.
  • align="정렬위치" : 그림의 위치 설정하기
    • top | 이미지의 위쪽에 문자가 나타난다.
    • bottom | 이미지의 아래쪽에 문자가 나타난다.
    • middle | 이미지의 중간에 문자가 나타난다.
    • texttop | 이미지와 문자를 정렬할 때 가장 높은 글자를 기준으로 이미지가 정렬
    • absmiddle | 그림의 가운데를 기준으로 정렬
    • baseline | 이미지의 가장 아랫부분을 기준으로 문자를 정렬
    • absbottom | 이미지의 아래쪽에서 현재 문단의 아래쪽을 기준으로 정렬
    • left | 문자를 기준으로 이미지가 왼쪽에 정렬
    • right | 문자를 기준으로 이미지가 오른쪽으로 정렬
  • border="테두리 두께"  : 그림의 경계선을 만듭니다.
  • hspace="크기" : 그림의 좌우 여백을 지정합니다.
  • vspace="크기" : 그림의 상하 여백을 지정합니다


출처: http://xmljang.com.ne.kr/html



블로그 이미지

하보니

하보니와 함께하는 phP 초보

댓글을 달아 주세요