태그자료
< 자료공유 < 태그자료
자료실

기초태그 2

페이지 정보

작성자 madalla 작성일13-02-06 23:25 조회1,410회 댓글0건

본문

태그이름 형식이 이미 지정된 문장을 표현하기
<pre> 쓰는 형식 그대로 보여주게된다. <p></p> 태그나 <br />태그를 따로 쓸 필요없이
쓴대로 그대로 적용되어 보여진다.
예)
<pre> 우리는 하 나 된 사람들
그래서 좋다.
</pre>
결과)
우리는 하 나 된 사람들
그래서 좋다
<xmp>
<pre>태그와 비슷하지만 다른점은 <xmp></xmp>사이의 모든 글자를 보여준다.
즉 태그 소스들까지 모두 보여지게된고 띄어쓰기도 그대로 보여진다.
소스보기할때 사용하면 좋다.
예)
<xmp> 우리는 하 나 된 사람들
그래서 좋다.
</xmp>
결과) 우리는 하 나 된 사람들 <br />
그래서 좋다 (차이를 알겠죠? )
<pre></pre>와 똑같은 글자인데 표현방식이 이렇게 됩니다.
<pre></pre>처럼 한 줄을 내리려면 <br/>을 없애고 그냥 엔터치셔서 글 내리심 됩니다.
쓴 그대로 여백까지 모두 보여주는 태그가 <xmp> 입니다.
태그이름 Superscript
<SUP> 윗첨자
예) 우리는<sup>하나인</sup> 사람들
결과) 우리는 하나인 사람들
태그이름 Subscript
<SUB> 아랫첨자
예) 우리는<sub>하나인</sub> 사람들
결과) 우리는 하나인 사람들
태그이름 사이띄개
HTML문서를 작성하는 것은 어찌보면 워드프로세서와 같다고 볼수 있다. 그러나 사이띄개를 할수 없는 불편함이 다소 많을 것이다. 아무리 스페이스키를 누른다고 막상 브라우저를 통해 볼경우에는 그렇게 보이질 않을 것이다. 이러한 현상은 모든 Space, Tab, Enter키를 1byte로 HTML문서가 인식하기 때문이다. 그래서 공백을 아무리 많이 주어도 브라우저에서는 인식하지 못한다.
예) 우리는 하나인 &nbsp; &nbsp;&nbsp;&nbsp;사람들
결과) 우리는 하나인     사람들
태그이름 글꼴을 표현한다.
<FONT> 글꼴, 모양을 달리 표현하고자 할때 다음과 같이 표현하면 된다.
예) <font color="white">색을 흰색으로 표현하기</font>
<font size="5">글자를 5로 키우기</font>
<font-type="dotum">글꼴을 돋움체로 표현하기</font>

요즘은 표준웹이 대세라 css에서 폰트 규정은 이런식으로 한다.
font-size:12px;color:white;font-family:dotum;font-weight:bold;
font-weight는 굵기를 말한다. bold는 굵게 normal는 일반글씨다.
결과) 색을 흰색으로 표현하기
글자를 5 로 키우기
글꼴을 돋움체로 표현하기
위의 사항중에서 주의해야 할 것은 글꼴이다. 앞에서 언급한대로 브라우저가 지원하는 기본적인 글꼴이 없다면 표현하고자 하는 글꼴이 나오지 않을 경우가 있으므로 조심하여야 한다. 또한 색깔을 표현하고자 하는 경우가 있는데 이는 사용자가 가지고 있는 VGA카드와 연관이 있다. 지원하는 색의 Bit수가 높으면 거의 모든 색을 지원한다고 볼수 있다. 색을 표현하는 방식은 색의 이름을 직접 써넣어주어도 되고 아니면 RGB값을 써넣어주어도 된다. 즉, White라고 써 넣어도 되고 FFFFF값을 넣어주어도 된다.
태그이름 주소, 서명 입력(Address)
<ADDRESS> HTML문서내에 사용자의 주소 및 서명을 넣을때 사용하는데, E-Mail이나 주소를 넣어주면 된다.
예) <address>
Copyrightⓒ1998-1999 Manden. All rights reseverd<BR>
Author Information : Pviper@unitel.co.kr<BR>
Last Modfied Date : 1998. 9. 6
</address>
결과)
Copyrightⓒ1998-1999 Manden. All rights reseverd
Author Information : Pviper@unitel.co.kr
Last Modfied Date : 1998. 9. 6
태그이름 Horizontal Line
<hr> 홈페이지를 구경하다보면 간혹 중간에 줄이 그어져 있는 것을 볼것이다. 말그대로 수평선을 긋는 기능이다.
예) <hr>
<hr size=6>
<hr noshade width=50% >
<hr width=50% color=Fuchia>
<hr width=50 align=right>
결과)








태그이름 정렬하기
<CENTER> 가운데 정렬
예) <center>가운데로 글자를 정렬합니다.</center>
결과)
가운데로 글자를 정렬합니다.
<RIGHT> 오른쪽정렬
예) <div align=" right">오른쪽으로 글자를 정렬합니다.</div>
결과)
오른쪽으로 글자를 정렬합니다.
<LEFT> 왼쪽정렬하기
예) <div align="left">왼쪽으로 글자를 정렬합니다.</div>
결과)
왼쪽으로 글자를 정렬합니다.
위 세가지 명령어는 글자뿐만아니라 HTML문서에 들어가는 모든 요소에 해당이 되는 사항이므로 잘 기억해 두는 것이 좋다. 표준웹에서는 text-align 으로 기본 정렬을 잡는다.
<div id="main" text-align:center:>
  • 페이스북으로 보내기
  • 트위터로 보내기
  • 구글플러스로 보내기