▒ 요약
HTML(HyperText Markup Language)
월드와이드웹(WWW)에서 하이퍼텍스트 문서를 만들기 위해 사용되는 언어입니다.
쉽게말해 인터넷을 통해 볼 수 있는 문서를 만들 때 사용되는 프로그래밍 언어, 규칙입니다.
즉, 인터넷으로 보는 모든 웹 페이지는 HTML 문서로 만들어지고 표현됩니다.
▒요약 메모장 html은 문서로 만들어 구현시킵니다. 이런 html문서를 만드는 도구로 여러가지 소프트웨어(S/W)가 있습니다만 가장 기본적으로 메모장으로 만들어 활용합니다. 메모장은 시작>프로그램>보조프로그램>메모장 에 있습니다. (http://cafe.daum.net/herjaherja)
|
|
▒요약 글자 태그 정리 <font size=숫자 color=색상값> </font> 글자 크기, 색깔 <B>굵은 글씨</B> <I>기울인 글씨</I> <TT>타자 친 것처럼</TT> <U>글자에 밑줄</U> <BIG>큰 글씨</BIG> <SMALL>작은 글씨</SMALL> <SUB>아래첨자</SUB> <SUP>윗첨자</SUP> |
▒요약 <marquee> 태그 글자를 움직여 보자!! '마퀴' 태그는 글자를 이리저리 다양하게 움직이게합니다. 다양한 활요은 다음장에 하나하나 차례로 배워봅니다. 일단, 기본 '마퀴' 태그를 이용해 움직임을 알아보세요. ^___^ ■ 소스 ■ <html> <head> <title>움직이는 글자</title> </head> <body> <marquee> 사랑해 </marquee> </body> </html> |
▒요약 <marquee> 태그 활용 글자를 맘데로 움직여 보자!! '마퀴' 태그에 아래 두 명령을 삽입시켜, 글자를 자유롭게 움직이게합니다. direction behavior=alternate 다양한 활용입니다. 실습을 통해 움직임을 알아보세요. ^___^ ■ 소스 ■ <marquee direction="left">왼쪽으로</marquee> <marquee direction="right">오른쪽으로</marquee> <marquee direction="up">위로</marquee> <marquee direction="down">아래로</marquee> <marquee behavior=alternate>좌우로 왕복</marquee> <marquee behavior=alternate direction=up>상하로 왕복</marquee> <marquee direction=up behavior=alternate><marquee behavior=alternate>지그재그</marquee></marquee> |
▒요약 <marquee> 태그 활용 2 이리저리 움직이는 글자를 빠르게, 느리게, 짧게 넓게....맘데로 움직여 보자!! '마퀴' 태그에 아래 4개 명령을 삽입시켜, 글자를 자유롭게 움직이게합니다. scrollamount loop width height 다양한 활용입니다. 실습을 통해 움직임을 알아보세요. ^___^ ■ 소스 ■ <marquee scrollamount="3"> 3 속도로 움직이기 </marquee> <marquee loop=2> 2번만 움직이기 </marquee> <marquee width=20> 가로 20안에서 움직이기</marquee> <marquee direction='up' height=90> 세로 90안에서 움직이기</marquee> |
▒요약 <marquee> 태그 다양한 실전 응용 앞서 배운 각종 명령 속성을 합하면??? 다양복잡현란!!! '마퀴' 태그에 앞서배운 명령을 합쳐 사용하면, 글자에 다양한 효과와 표현을 줄 수 있습니다. direction behavior=alternate + width + loop scrollamount + loop width + scrollamount height + behavior=alternate . . . 다양한 활용입니다. 실습을 통해 움직임을 알아보세요. ^___^ ■ 소스 ■ <marquee behavior=alternate width=35>(*^.^*)</marquee> <marquee direction="right" scrollamount="1"> (ㅠㅠ)</marquee> <marquee width=500 scrollamount=300>(^___^)/</marquee> <marquee direction=up>컴<ul>으<ul>로<ul>허<ul>자<ul>허<ul>자<ul></marquee> <marquee>허<br>자<br>허<br>자</marquee> <marquee bgcolor=black><font color=ffffff size=7>허자허자</font></marquee> |
▒요약 문장, 문서 태그 입문 글자에 대해 배울 때 글자를 크게, 작게, 예쁜 색깔, 움직이기 등 여러가지 글자 관련 태그가 있었던것 처럼 문서만들 때에도 문서 만들기 관련 하여 다양한 태그가있습니다. 아래 소스 가지고 우선 감만 잡아보세요. 그 다음에 하나씩 하나씩 문장, 문단을 배워서 예쁜 문서를 만들어 보아요. ^___^) ■ 소스 ■ <html> <body bgcolor=pink> <center> <hr width=400> <font size=2> 해용씨, 저 허자에요... <p>사실은 제가 예전부터 쭉~ 욱 <br>해용씨를 지켜보며 혼자 짝사랑했어요 <p>제 마음을 받아주세요. <br> <br>넹? -_-;;; <br> </font> <hr width=400> <xmp> <br>태그 <p>태그 <center>태그 <xmp>태그 <hr>태그 bgcolor </xmp> </center> </body> </html> |
▒요약 <body> 속성 태그 문서모양을 예쁘게 만들기 위한 문장,문단을 조절하는 태그들을 배워봅니다. 첫번째로 본문전체를 조절하는 body 관련 속성 태그입니다. 아래 소스 3가지에 대해 모두 실습해보세요. ■ 소스 ■ <body bgcolor=yellow> < /body> <body text=green> </body> <body background="http://www.herjaherja.com/image/etc/a04.gif"> </body> http://www.herjaherja.com/image/etc/a01.gif http://www.herjaherja.com/image/etc/a02.gif http://www.herjaherja.com/image/etc/a03.gif |
▒요약 <br> <p> 태그 문서를 작성하다보면 다음줄로 줄바꿈해야겠죠? <br> 과 <p> 태그를 이용하여 줄바꿈을해보고 두개의 차이점을 비교해 보아요. htnl에서는 글자간격을 많이 띄어도 한칸 띈걸로 인식합니다. 태그를 사용하여 빈칸 숫자를 조절합니다. ■ 소스 ■ <html> <body> 글자만들기는 이러쿵 저러쿵하여<br> 글자는 이러 저러 만듭니다.<p> 그림만들기는 이러쿵 저러쿵하여<br> 그림을 만들 때는 어쩌구 저쩌구.... </body> </html> |
▒요약 선긋기 <hr> 태그 문서를 작성하다보면 선을 긋는 경우가 많습니다. <hr> 태그를 이용하여 선을 그어보고 <hr> 에 끼어넣는 size="숫자" width="숫자" noshade style="color:색상값;" 태그들을 이용하여 다양한 선의 변화를 줄수있습니다. ■ 소스 ■ <html> <body> 1<hr> 2<hr size=5> 3<hr width=20> 4<hr width=20%> 5<hr noshade> 6<hr style="color:red;"> 7<hr size=1 width=60% noshade style="color:#000000;" > </body> </html> |
▒요약 정렬 <p align> 태그, 소스보기 <xmp> 태그 문서를 왼쪽 정렬할까? 오른쪽 정렬할까? 가운데로 맞출까? <p align="위치"> 태그를 이용하여 문서의 모양을 왼쪽으로 오른쪽으로, 가운데로...정렬해 보세요. <p align="left"> <p align="right"> <p align="center"> 소스보기 할 때 태그소스까지 다 보여주고 싶으면 <xmp> 를 사용하면 됩니다. <xmp> 내용 </xmp> 사이의 내용들은 태그 소스까지 모두 보여집니다. ■ 소스 ■ <html> <body background="http://www.herjaherja.com/image/etc/bgimage.jpg"> <p align="left">5천만 프로젝트 컴으로 허자! 허자! <p align="right">5천만 프로젝트 컴으로 허자! 허자! <p align="center">5천만 프로젝트 컴으로 허자! 허자! </body> </html> |
'태그♡소스방' 카테고리의 다른 글
태그, 이렇게 사용하세요! (0) | 2007.01.25 |
---|---|
컴퓨터 태그 배우기 (0) | 2007.01.25 |
글자태그 총집합 (0) | 2007.01.25 |
(프로그래밍 언어) HTML 태그표 (0) | 2007.01.25 |
다양한 글자 색상소스 (0) | 2007.01.22 |