본문 바로가기

◑◐ 컴과인터넷

바탕화면 만들기- 태그- 특수문자

 

모음을 누르고 ctli(컨트럴) 키를 누른다

,·´″°³о♡          ▒♡▒   ▒ ♣ ▒      ▩ ♤ ▩    ◆       ■  ♤  ◑     ♬  ▒          ,·´″°³о♬     ≪♤≫   

 

아래 모든 태그는 즐겨찾기의 "태그연습장"으로 이동 실행시켜볼수있다.

주소:  http://www.tagmania.net/html/tagnote.htm  즐겨찾기에도 주소있음

 

바탕화면

[Shell]
Command=2
IconFile=explorer.exe,3

[Taskbar]
Command=ToggleDesktop

메모장에 복사한후 바탕화면.scf 저장함

탐색기
C:\WINDOWS\EXPLORER.EXE /n,/e,C:\

 


<img src="그림주소" align=left> 이렇게 align=left 를 넣고 글을 쓰면, 그림은 왼쪽에 나오고, 글씨는 오른쪽에 나옵니다.

align=right 를 넣으면, 그림은 오른쪽, 글씨는 왼쪽에 나옵니다.

align=center 를 넣으면, 그림은 가운데, 글씨는 좌우 양쪽에 나옵니다.

<img src="그림주소" align=left vspace=10 hspace=10>

vspace=10 hspace=10<-이명령어가 그림과그림사이를뛰우는 명령어

<IMG src="그림.gif" style="float: left; margin: 0 20 20 0; clear: left;">

clear: 속성은 none left right both 4가지 중의 값을 가지는데 디폴트값은
none 으로 좌우측에 글이나 그림등이 오는 것을 허용한다는 뜻이고
left 는 좌측에 글이나 그림등을 오지 못하게 하는 것이며
right 는 우측에 글이나 그림등을 오지 못하게 하는 것이고
both 는 좌측, 우측 모두 아무것도 오지 못하게 하는 것입니다.

 

(아래 자주색 문장 참조)

 

 

명령어
</a>띠어쓰기 </br>다음줄로이동 <pre> 꿁게쓰기

<font color="red">태그매니아</font> 태그매니아 <--불근색

배경그럼 넣기 <body background="이미지주소">  <- 이미지가 배경화면이 된다.
<style>BODY{background:url('이미지주소')}</Style>
배경이미지 고정 <BODY BACKGROUND="배경이미지주소" BGPROPERTIES="fixed">

배경색 넣기 (<body bgcolor=색명나 RGB코드> ) or (<style>body{background:색명;}</style>)
예제 <body bgcolor="green">

 

 ===========================================================================================

bgsound src="음악주소">주로 홈페이지의 배경음악을 넣는 데 사용하는 태그다. mid 파일을 주로 사용하고...wav파일이나 mp3 파일도 되긴 되는데 -bgsound 태그는 일단 음악파일을 다 다운로드 받은 다음 재생을 시키기 때문에 mp3 나 wav는 시간이 오래 걸린다

 

<embed src="음악주소">bgsound 태그가 익스플러워 전용으로 만들어 진거라면 embed 태그는 네스케이프에서 음악을 재생시킬 수 있도록 만들어진 태그입니다. 그런데 요즘은 익스플러워와 네스케이프 양쪽 다 잘 된답니다.

 

embed 태그는 배경음악보다는 직접 음악을 재생시키는 때 많이 사용됩니다. 주로 채팅방이 되겠죠^^ embed 태그의 특징은 bgsound 태그와는 달리 파일을 다 다운받은 받은 다음에 재생하는 것이 아니라 다운로드와 동시에 실시간으로 재생시켜주죠...^^ 또한 여러가지 속성이 따라 붙는데요...속성에 대해선 밑에서 설명드리져^^

 

<a href="리얼 음악주소" target="new">아무 글자</a>보시다시피 ra, ram 파일을 불러올때 사용되는 태그입니다. <a> 태그는 사운드 태그라기보다도 링크태그인데...ra, ram 파일을 링크시키고 밑줄이 쳐진 글자를 클릭하면 리얼플레이어가 실행되면서 음악이 나오게 됩니다. 주로 채팅방에서 많이 사용됩니다.


<object src="음악주소">object 태그는 거의 사용하는 사람들이 별루 없는데요...이것은 embed와 기능은 같은데 새로운 자바창(?)이 뜨면서 거기에 음악상태바나 동영상이 나타나게 되죠. W3C에서 embed 보다는 object 를 사용할 것을 권고하고 있다네요.


autostart=true/false true의 경우 로딩되자마자 자동실행되고 false의 경우 그 반대죠^^
hidden=true/false 음악조절판이 true의 경우 보이지 않고 반대로 false의 경우 보이게 됩니다.
loop=true/false true일 경우 계속 반복, false일 경우 한번만 반복이져^^
width=수치 height=수치 음악조절판의 좌우높이 조절을 하는 옵션입니다.

===========================================================================================

 


<IMG> 그림을 삽입하기 위한 태그 <img src=" ">

 

<a href>주소를 링크하는 태그 <a href=" " target="_blank">클릭</a>

 

<center>태그매니아</center> 글자 가운데 넣기

 

<ALIGN=TOP,MIDDLE,BOTTOM> 그림 다음에 오는 글자를 그림의 상단,중앙,아랫부분에 나오도록 지정


예 <img src="
http://tagmania.net/img/filter1.gif" border="1" hspace="5" vspace="3" align=top>문자가위에나온다

 

width="수치" 넣은 수치만큼 이미지의 가로 너비를 조정해주는 속성

width="750"height="800" (650,450)

 

height="수치" 넣은 수치만큼 이미지의 세로 높이를 조정해주는 속성


hspace="수치" 이미지의 가로 간격(공간)을 주는 속성입니다.

간격이란 하나의 이미지와 글자 사이의 공간의 너비를 말하는 것


vspace="수치" 이미지의 세로 간격(공간)을 주는 속성


border="수치" 이미지의 테두리 두께를 나타내줍니다.


border="0" 일 경우에는 테두리가 나타나지 않고 1부터 테두리가 나타남

예문
<img src="
http://tagmania.net/img/filter1.gif" border="1" hspace="5" vspace="3" align="left">

 

이미지 링크시키는 방법. 이미지링크시키는 형식은 세가지

이미지에서 웹페이지로 링크, 이미지에서 이미지로 링크, 웹페이지에서 이미지로 링크

 

ⓐ 이미지→ 웹페이지로 링크 <a href="웹페이지주소"><img src="이미지주소"></a> 예제보기


ⓑ 이미지→ 이미지로 링크 <a href="이미지주소"><img src="이미지주소"></a> 예제보기


ⓒ 웹페이지→ 이미지로 링크 <a href="이미지주소">여길클릭</a> 예제보기
==================================================================================

※ 동일 문서 내에서의 링크
여기에서는 동일 문서내에서의 이동하는 방법을 배워보도록 하겠습니다. 다른 용어로 앵커태그동일한 웹페이지 내에서 일정 부분을 클릭하면 그 동일한 웹페이지내의 다른 부분으로 이동할 수 있는 링크방법
<a name="love">이동될 부분</a> , <a href="#love">이동</a>

 

예제보기

위에 소스 중에서 love 라고 나오는 부분 2곳이 있는데요 여러분들이 내키는 대로 아무 글자나 집어 넣어도 됩니다. 다만 양쪽 글자가 반드시 같아야 합니다.

 

이미지 링크 주위에 테두리 제거
이미지를 링크시키면 불필요하게 이미지주변에 시퍼런 테두리가 생길때가 있습니다. 그럴 경우에는 이미지 태그 안에 위처럼 border="0" 를 적어 넣으시면 됩니다.border="수치" 는 테두리의 두께를 조절하는 속성이랍니다.

<a href="이동할 주소"><img src="이미지주소" border="0"></a>

 

==========================================================================================

target 속성
타겟 속성은 링크태그와 밀접한 관계에 있는 속성입니다. 특히 프레임 태그에서는 초보분들이 가장 많이 어려워하시는게 이 target 속성이랍니다.

 

일단 여기에서는 매직타겟에 대해서만 배워보도록 하겠습니다. 매직타겟이란 별도의 name 지정없이 target을 지정할 수 있는 속성입니다.

 

매직타겟 이외에 name을 지정해주어서 target을 정해주는 방법은 프레임 태그(화면 분할하기)부분에서 설명드리져^^

 

target="_blank" 혹은 target="new"
새로이 로딩될 내용을 새로운 익스플러워창에 나타내주는 것입니다

target="_self"
현재의 화면에 새로운 내용을 나타내어줍니다

target="_top"
현재의 화면이 프레임화면일때(여기처럼 나누어진 화면) 현재의 프레임이 없어지고 전체하나의 화면에 내용이 나타나는 것입니다. "_blank"처럼 새로운 익스플러워창이 새로 생기는 것이 아니라 자신의 화면에서 프레임으로 분할된 것이 없어지고 전체 화면에 표시됩니다.

target="_parent"
링크 부분이 있는 프레임에 새로운 프레임이 만들어져 새로운 내용을 표시합니다. 이옵션은 부모계층에 해당하는 <FRAMESET>에 페이지를 로드합니다.

사용방법은 <a href="링크될 주소" target="_blank">클릭</a> ☜이런 식이져^^


포토샾이미지그림 카페에 올리리기는 이미지를 포토샾에 불러 편집후 메일로 보낸다음 메일속성을 img src 로 올리고 html로 선택한다.
 
<img src="http://iresys.pe.kr/seven/law/images/1204.gif"border="1" hspace="5" vspace="3" align="left">쥐
border="1" hspace="5" vspace="3" align="left">쥐<==글을 그림옆으로 쓸수있는 태그함수
<style>BODY{background:url(http://www.tagmania.net/img/img_2.gif)}</Style> 배경넣기
<body background="http://www.tagmania.net/img/img_2.gif">

meta, hr, img,  -bgsound, embed 등의 태그는 혼자 단독으로 사용되는 태그들이다.
물론 속성이 없다는 이야기가 아니다. </태그명령어>가 필요 없다는 이야기이다.

 

글씨키우기 태그

<font size="5">글씨 크져^^</font> 글씨 크져^^
<h1>이건 더 크져^^</h1> 이건 더 크져^^
<font style = font-size:30pt>더욱 크져</font> 더욱 크져

 

글씨체 태그

<font face="궁서체">이건 궁서체네용^^</font> 이건 궁서체네용^^
<font face="돋움체">이건 돋움체이구용^^</font> 이건 돋움체이구용^^
<font face="바탕체">이건 바탕체입니다^^</font> 이건 바탕체입니다^^
<font face="Arial">이건 Arial 체입니다.^^</font> 이건 Arial 체입니다


문장정렬
<pre>내용<pre> 내용시작과 끝에 pre를 부치면 스페이스공백많큼 글이 떨어진다

<marquee> 이게 마퀴태그의 기본이져^^</marquee> <--글자가 왔다갓다함 >
<marquee><font face="돋움체" color="bluesky" size="5">총정리</font></marquee>
<글자가우에서 좌로감 >


<DIV ALIGN=right>오른쪽정렬</div> 오른쪽 정렬

<DIV ALIGN=center>가운데 정렬</div> 가운데 정렬

<DIV ALIGN=left>왼쪽 정렬</div> 왼쪽 정렬


<font color=red> 빨간색
<font color=orange> 오랜지색
<font color=redblue> 연한파란색
<font color=magenta> 핑크
<font color=pink> 연한핑크색
<font color=olive> 금색
<font color=bluesky> 연한녹색
<font color=break> 투명한논색
<font size=5 color=magenta face=궁서체> 핑크
<font size=5 color=red face=궁서체> 빨간색
<font size=5 color=pink face=궁서체> 연한핑크색
<font size=5 color=olive face=궁서체> 금색
<font size=5 color=orange face=궁서체> 오렌지색
<font size=5 color=bluesky face=궁서체> 연한녹색
<font size=5 color=break face=궁서체> 투명한녹색
<font size=5 color=redblue face=궁서체> 연한파란색


① <font face="@궁서">를 하면 글자가 쓰러집니다. <--옆으로 누운글임
모든 글자체 앞에 @ ☜골뱅이 마크를 붙이면 글자가 쓰러집니다.


② <b>글자</b> 를 사용하면 글자 --> 글자 해당 글자가 두꺼워 집니다.

 
③ 글자 주위에 이렇게 ☞ 색을 넣는 것 은 <span style="background-color: 색명">글자</span>를 사용하면 됩니다.


마퀴대그
<marquee scrolldelay="수치">내용</marquee> (<-한쪽으로)수치 높을수록 속도는 낮다

 

<marquee scrollamount="수치">내용</marquee> 수치 높을수록 속도는 빠름

 

<marquee behavior=alternate>내용</marquee> 왕복운동 

  behavior=alternate 속성은 좌우왕복하는 기능을 합니다. 마퀴태그내의 내용을 좌우왕복시켜주져^^

 

<marquee loop="수치/infinite">내용</marquee> 태그 회수지정

<marquee bgcolor="색명/RGB색상코드">내용</marquee> 바탕 명암주기 스팬스타일과비슷

 

<marquee direction="left,right,up,down">내용</marquee> 방향 정하기 (left)(right)(up)(down)

 

<marquee bgcolor="색명/RGB색상코드">내용</marquee> 태그 바탕화면 색깔 정하기

<marquee width="가로수치" height="세로수치">내용</marquee>태그 바탕화면 넓이정하기

 

응용1

상하반복(behavior!=alternate)과 상단 스크롤(up)
예: 1. <marquee behavior!="alternate" direction="up">하핫</marquee>

 

좌우반복
예: 1. <marquee>←♡--<</marquee>
2. 큐피트의 화살<marquee width="300">←♡--<</marquee><font size="5">{></font>

 

랜덤반복
예: 1.<marquee behavior!="alternate" width="300" height="300"><marquee align="center" behavior!="alternate" direction="up" width="200" height="300">하핫</marquee></marquee>

 

빤짝빤짝
예: 1. <marquee behavior!=alternate width=1100 scrollamount=1000> 반짝</marquee>

예:<marquee behavior =alternate width=1000 scrollamount=1000> <img src="https://t1.daumcdn.net/cfile/blog/1855A8244A8A1E5A44"> </marquee>


글자 돌리기(숫자가 괄호넓임)
(<marquee behavior!=alternate width=30>언제나 당신을 사랑합니다@^.^@</marquee>)

글자 한자씩 계속 나오기


예: 1. <MARQUEE DIRECTION=RIGHT><MARQUEE DIRECTION=LEFT>여러분~~ 안녕하세요^^ 만나서 방갑습니다. - 태그매니아-</MARQUEE>


2. <marquee direction="RIGHT" scrollamount="1"> __@/``</marquee>

<marquee behavior!=alternate width=1100 scrollamount=1000><h1>★</font><br>


<marquee bgcolor=pink>모두즐팅하소^^*</marquee><marquee bgcolor=cred>왜그라요.</marquee>


<marquee direction=up behavior!=alternate height=40>^^"아니라니까</marquee>올라내라


<marquee direction='down'><marquee><h1>하핫~</h1></marquee></marquee>

 

<marquee width=400>토커<marquee width=300>←♡-<</marquee></marquee><font size=6>{>


<marquee width=500 scrollamount=300><font size=7>정신없당~</marquee>

<MARQUEE bgcolor=white direction=up> 사랑이란.... <P><P> 끝없는<P><P> 기다림의 연속이다....<P><P></MARQUEE>


<MARQUEE direction=right>ⓘ ⓛⓞⓥⓔ</MARQUEE>♡<MARQUEE direction=reft>ⓨⓞⓤ</

 

<marquee><a href="http://my.stoneradio.com/vicgen"><font size=3 color=magenta face=깨비체><b>크릭~~</B> <font color=blue font size=3 face=궁서체><b><span style="background-color:orange"> broadcasting station </b> <font color=red font size=3> <span style="background-color:white"> <== 골라듣는 음악~</b> </marquee>

<marquee behavior!=alternate ><a href="http://my.stoneradio.com/vicgen"><font size=3 color=magenta face=깨비체><b>크릭~~</B> <font color=blue font size=3 face=궁서체><b><span style="background-color:orange"> broadcasting station </b> <font color=red font size=3> <span style="background-color:white"> <== 골라듣는 음악~</b> </marquee>

<marquee scrollamount="50" ><a href="http://my.stoneradio.com/vicgen"><font size=3 color=magenta face=깨비체><b>크릭~~</B> <font color=blue font size=3 face=궁서체><b><span style="background-color:orange"> broadcasting station </b> <font color=red font size=3> <span style="background-color:white"> <== 골라듣는 음악~</b> </marquee>


표만들기

<table border="2" width="400" height="400">
브라우져의 크기를 조절해도 표의 크기는 변하지 않습니다.

<table border="2" width="50%" height="50%">
브라우져의 크기를 조절하면 표의 크기가 변합니다.


=================================================================================
==================================================================================

html(일명태그 연습)

http://my.stoneradio.com/vicgen

<marquee>태그매니아</marquee>

<a href="http://my.stoneradio.com/vicgen"><b>빅젠방송국 가기</b> vicgen 방송국 가기</a>

<a href="http://my.stoneradio.com/vicgen"><font size=5 color=magenta face=궁서체><b>vicgen 방송국 가기</b> <==클릭 행복을 위해서</a>

<a href="http://my.stoneradio.com/vicgen"><b>vicgen 방송국</b><font size="3"><==클릭 많은 읽을거와 함께 </a>

<a href="http://my.stoneradio.com/vicgen"><font size="3"><color=magenta><b>vicgen 방송국</b><font size="5"><font color=red><font face=궁서체><==클릭 읽을거리와함께</a>

<a href="http://my.stoneradio.com/vicgen"><font size="3"><b><font color=red>음악과 읽을거리<font color=blue><==vicgen방송국</b>

<a href="http://my.stoneradio.com/vicgen">vicgen방송</a>

태그화면
<img src="http://my.netian.com/~dong5201/hwalbum/20021031162139/etc_234.gif"><a href="http://www.stoneradio.com//club/clubs.asp?cast_code=21997">음악듣기

남의방송국
<a href=" http://www.joouso.tv/gkgkeogh.pls"><font size=3>크릭~~<font color=red><b>아쉬운대루 듣는 남의방송</b>

<a href="http://kang8661.inlive.co.kr/listen.pls">빌려온 방송2
<a href="http://akfldls.inlive.co.kr/listen.pls">빌려온 방송1
<a href="http://sealove53.inlive.co.kr/listen.pls">빌려온 방송3
<a href="http://www.saycast.com/kmh2788.pls">요건 빌려온방송4
<a href="http://gkgkeogh1205.inlive.co.kr/listen.pls">밤안개방송

태그매니아

위에서 보시다시피 먼저 태그는
<태그명령어>내용</태그명령어> ☜이처럼 이루어지는 걸 볼 수 있다.

세 번째 예를 보면 <font color=red> ☜이 부분에서
font 라는 태그에 color="red" 라는 것이 붙는데 이걸 태그에 속성이라고 한다.

단순히 태그명령어로 만으로는 효과적으로 표현할 수 없기 때문에 주로 사용되는
태그명령어에는 예외 없이 이러한 속성을 갖는다.

네 번째 예에서 <a href="...."> 역시 href 라는 속성을 갖는다.
그리고 이러한 태그 역시 예외 없이 <font></font> , <a></a> 로서 끝맺음이 되는 것을 알 수 있다
만약 태그 끝에 </태그명령어> 를 붙여주지 않는다면 어떻게 될까?
가장 초보들이 잘 범하는 실수 중 하나인데 먼저 전제된 태그의 효과가
그 전제된 시점부터 웹 페이지의 마지막 부분까지 미치게 된다.

대화방의 경우는 font 태그는 상관없는데 그 외의 태그 같은 경우에는 대화방에서 당신이
나갈때까지 그 효과가 지속된다.

그러므로 대화방에 상당한 혼란을 줄게 된다.
그와 동시에 심하면 방장으로부터 강제퇴장을 당하는 사태도 벌어질 수도 있다.
그러니 끝맺음을 꼭 해주자.....

그런데 이러한 태그에 기본원리를 무시하는 태그가 일부 있다.

그림관련 테그


<IMG SRC="파일명" BORDER=n> 그림을 나타나게함.테두리선은 n값
<IMG SRC="파일명" BORDER=0 WIDTH=n HEIGHT=n> 그림의 넓이와 높이를 지정
<IMG SRC="파일명" ALT="그림설명"ALIGN=LEFT,CENTER,RIGHT> Alt=그림에 대한 설명,
ALIGN=그림정렬방식
<IMG SRC="파일명"

링크관련 태그

<A HREF="연결될 파일명">글자,그림</A> 글자,그림을 누르면 연결될 문서로 이동한다
<A HREF="HTTP://링크할 주소">글자,그림</A> 링크된 주소로 이동한다
<A HREF="MAIL TO:자신의 메일 주소">글자,그림</A> 편지함과 연결된다
<A HREF="문서명">글자,그림</A><A NAME="문서명">문서명 문단의 첫부분</A> 같은 문서 내에서의
이동이 가능하게 하는 태그 ((태그기초강좌 이미지태그2 참조))


그림넣기

<img src="이미지주소">
예: <img src="http://tagmania.net/img/filter1.gif"> 철도원그림
<img src="http://tagmania.net/img/filter1.gif" border="1" hspace="5" vspace="3" align="left"> 그림에테두르기

<body background="이미지주소">


예제(주소에 그림이 없어 안될수있음 주소만 그림있는사이트로 고치면됨)

<IMG SRC=http://myhome.shinbiro.com/~powerguy/ohmovie.gif>오양은 없다
<img src=http://web-pd.com/banner/soouri.gif>쉬리당~~
<IMG SRC=http://web-pd.com/banner/booking.gif>부킹에서2차까지!
<img src=http://pro.kacl.co.kr/star/stct/lee.jpg>대중 교통을 이용합시다...^^
<img src=http://pro.kacl.co.kr/star/stct/poongkum.jpg>내 마음의 풍군...^^
<img src=http://parody.co.kr/neoboard/upload/webpd/smell.gif>남자의 향기...^^


<a href="http://f1.inlive.co.kr:1210/listen.pls"><font size=2 color=magenta face=궁서체> 크릭<font color=blue>*인기IJ 옥슨과 함께*<font color=red> 고향열차 ((055-673-4249))<-전화해야 잼있는 시간<b>

산을 좋아하고 커피를 좋아하고 음악을 좋아하는 남자...당신도 음악을 좋아하나요?내가 즐겨듣는 음악들 http://my.stoneradio.com/vicgen


<a href=" http://my.stoneradio.com/vicgen "><font size=2 color=magenta face=궁서체> 크릭<font color=blue>골라듣는 음악*<font color=red><b>빅젠방송</b>


<a href="http://my.stoneradio.com/vicgen"><font size=3 color=magenta face=깨비체><b>크릭~~</B> <font color=blue font size=3 face=궁서체><b><span style="background-color:orange"> "vicgen broadcasting station" </b> <font color=red font size=3> <span style="background-color:white"> <== 골라듣는 음악~</b>