웹마스터 팁

◈ 글자 태그 - 모양을 자유자재로

이 강좌에서는 글자를 자유 자재로 다루는 그런 태그를 다룰겁니다...여러 사이트 가보시면 글자 모양이 별 엽기적인 모양이 다 되는...그런 모양 보셨지요?? 물론 이미지로 구현해야 하는 것도 있겠지만...아래 소스들의 영향도 크답니다...바로 스타일 시트에서 떨어져 나온 span 태그 덕분인데여...그 태그를 잘 활용하시면 글자에 9pt 크기도 넣을 수 있구...여러 효과도 날 수 있게 한답니다~ 그럼 글자 크기를 맘껏 키워 보시거나~엽기적인 글자를 자~알 배워서...자~알 써먹으세요~

NZEO.COM
<font color="red">NZEO.COM</font>

NZEO.COM
<font face="궁서">NZEO.COM</font>

NZEO.COM
<span style="COLOR:white;FILTER:shadow
(color=#0066cc);height:4px">NZEO.COM</span>

NZEO.COM
  <span style="font-family:돋움;font-size:10pt;color:#ffffff;width:100%;
height:20;Filter:Glow(color=#0000ff,strength:2)">NZEO.COM</span>

엔지오다~~
  <span style="font-family:돋움;font-size:10pt;font-weight:bold;
color:#ff7404;width:100%;height:23;Filter:Shadow
(color=#ff9e2e,direction=125)"> 엔지오다~~ </span>  

야후
  <span style="COLOR:black;FILTER:shadow
(color=#cccccc);height:4px">야후</span>

다음
  <span style="color:white; filter:glow(color:blue); height:28px">
<font size="5"><b>다음</b></font></span>

NZEO.COM
  <span style="color:red; filter:glow(color:red); height:28px">
<font size="5">NZEO.COM</font></span>

NZEO.COM  
<DIV style="width:100; height:12; font-size:9pt; filter:glow(color=red, strength=10)">NZEO.COM</div>

NZEO.COM
  <SPAN style="FILTER: glow(color=0033ff); COLOR: white; HEIGHT: 8px">NZEO.COM</span>
  
NZEO.COM  <span style=font-size:9pt;color:white;width:100%;height:20;Filter:Glow(color=ff6633,strength:2)">NZEO.COM</span></style>

NZEO.COM  <span style=font-size:9pt;color:white;width:100%;height:20;Filter:Glow(color=yellow,strength:2)">NZEO.COM</span></style>

NZEO.COM  <span style=font-size:9pt;color:white;width:100%;height:20;Filter:Glow(color=green,strength:2)">NZEO.COM</span></style>

NZEO.COM  <span style=font-size:9pt;color:white;width:100%;height:20;Filter:Glow(color=orange,strength:2)">NZEO.COM</span></style>

NZEO.COM  <span style="font-size:9pt;color:white;width:100%;height:20;Filter:Glow(color=0000ff,strength:2)">NZEO.COM</span></style>

NZEO.COM  <span style="font-size:9pt;color:white;width:100%;height:20;Filter:Glow(color=9966ff,strength:2)">NZEO.COM</span></style>

NZEO.COM  <span style="font-size:9pt;color:white;width:100%;height:20;Filter:Glow(color=red,strength:2)">NZEO.COM</span></style>


NZEO.COM  <span style="font-size:9pt;color:white;width:100%;height:20;Filter:Glow(color=ff99ff,strength:2)">NZEO.COM</span></style>

NZEO.COM   <span style="font-size:9pt;color:white;width:100%;height:20;Filter:Glow(color=3399ff,strength:2)">NZEO.COM</span></style>

NZEO.COM  <span style="font-size:9pt;color:white;width:100%;height:20;Filter:Glow(color=00cc99,strength:2)">NZEO.COM</span></style>

NZEO.COM  <DIV style="width:100; height:12; font-size:9pt; filter:glow(color=blue, strength=8)"><font color=deeppink>NZEO.COM</font></DIV></style>


NZEO.COM <DIV style="width:100; height:12; font-size:9pt; filter:glow(color=ccff99, strength=8)"><font color=deeppink>NZEO.COM</font></DIV></style>


NZEO.COM <DIV style="width:100; height:12; font-size:9pt; filter:glow(color=pink, strength=8)"><font color=deeppink>NZEO.COM</font></DIV></style>

NZEO.COM  <DIV style="width:100; height:12; font-size:9pt;filter:glow(color=red, strength=8)"><font color=blue>NZEO.COM</font></DIV></style>


NZEO.COM <DIV style="width:100; height:12; font-size:9pt;filter:glow(color=6633ff, strength=8)"><font color=blue>NZEO.COM</font></DIV></style>


NZEO.COM <DIV style="width:100; height:12; font-size:9pt;filter:glow(color=9933ff, strength=8)"><font color=blue>NZEO.COM</font></DIV></style>


NZEO.COM <DIV style="width:100; height:12; font-size:9pt;filter:glow(color=9933ff, strength=8)"><font color=3399ff>NZEO.COM</font></DIV></style>


NZEO.COM <DIV style="width:100; height:12; font-size:9pt;filter:glow(color=ff6699, strength=8)"><font color=3399ff>NZEO.COM</font></DIV></style>



  

빨간색 그림자 글씨  <span style="color:White; width:100%; height: 12; font-size: 9pt; Filter: shadow(color=red,direction=135)">빨간색 그림자 글씨</span>

녹색 그림자 글씨  <span style="color:White; width:100%; height: 12; font-size: 9pt; Filter: shadow(color=green,direction=135)"> 녹색 그림자 글씨</span>

연두색 그림자 글씨  <span style="color:White; width:100%; height: 12; font-size: 9pt; Filter: shadow(color=66cc00,direction=135)"> 연두색 그림자 글씨</span>

보라색 그림자 글씨  <span style="color:White; width:100%; height: 12; font-size: 9pt; Filter: shadow(color=660099,direction=135)"> 보라색 그림자 글씨</span>

분홍색 그림자 글씨  <span style="color:White; width:100%; height: 12; font-size: 9pt; Filter: shadow(color=ff6699,direction=135)"> 분홍색 그림자 글씨</span>

자주색 그림자 글씨  <span style="color:White; width:100%; height: 12; font-size: 9pt; Filter: shadow(color=magenta,direction=135)"> 자주색 그림자 글씨</span>

검은색 그림자 글씨  <span style="color:White; width:100%; height: 12; font-size: 9pt; Filter: shadow(color=black,direction=135)"> 검은색 그림자 글씨</span>

오렌지색 그림자 글씨  <span style="color:White; width:100%; height: 12; font-size: 9pt; Filter: shadow(color=orange,direction=135)"> 오렌지색 그림자 글씨</span>


하늘색 그림자 글씨  <span style="color:White; width:100%; height: 12; font-size: 9pt; Filter: shadow(color=3399ff,direction=135)">하늘색 그림자 글씨</span>

회색 그림자 글씨  <span style="color:White; width:100%; height: 12; font-size: 9pt; Filter: shadow(color=cccccc,direction=135)">회색 그림자 글씨</span>

빨간 바탕  <span style=font:9pt;color:white;background-color=red>빨간 바탕</span>

주황색 바탕  <span style=font:9pt;color:white;background-color=ff6633>주황색 바탕</span>

진노란색 바탕  <span style=font:9pt;color:white;background-color=ffcc00>진노란색 바탕</span>

녹색 바탕  <span style=font:9pt;color:white;background-color=green>녹색 바탕</span>

하늘색 바탕  <span style=font:9pt;color:white;background-color=3399ff>하늘색 바탕</span>

보라색 바탕  <span style=font:9pt;color:white;background-color=9966ff>보라색 바탕</span>


글자가 뒤집히네~  <span style=filter:flipv();height:1px;><font color=green>글자가 뒤집히네~</span></font>

글자가 뒤집히네~  <span style=filter:fliph();height:1px;><font color=green>글자가 뒤집히네~</span></font>

출처 : 태그대학

제목 글쓴이 날짜
files 폴더안의 cache 폴더/파일 1초만에 지우기 [3] 999 2010.06.21
referer 로 사이트 차단하기.. [3] 하얀마법 2010.06.20
관리자id , 닉네임, e-mail주소, 바꾸기, 최고관리자권한 없애기 [3] 유병철 2010.06.18
첨부파일 100% 에서 사라지는 문제 해결 방법 [8] 엔키오 2010.06.11
''외부 페이지''에서 CSS/JS 파일 불러들이기 [2] xe-m 2010.06.11
첨부파일 100% 에서 사라지는 문제 저도 해결 [2] 안나오네 2010.06.09
LNB위젯사용하지 않고 초간단 페이지 인식 메뉴 만들기 file 쥰지 2010.06.09
갤러리 게시판적용시 공지사항을 넣었는데 간격조정이 안맞을경우 file 유리가면™ 2010.06.08
파일첨부 100%에서 증발 하는 문제 해결 [1] asgasg 2010.06.08
그동안 고심하던 제로보드 에디터 문제 해결되었음을 기쁜마음으로 알립니다. 유샤인 2010.06.07
[트래픽] 줄이기 팁! 레벨별 아이콘을 CDN 으로 (cafe24) [11] 999 2010.06.04
XE 최근 업데이트후 CSS background이 안먹히는 현상 해결. 소렌트. 2010.06.02
하단 사이트맵 원하는 메뉴만 띄우기 [2] 제이닷 2010.06.02
xe를 업데잇 하며 얻은 중대한 경험담. [4] Blue Apple 2010.06.01
mp4 파일을 JW Media Player에 재생할 수 있도록 변경하기 [5] 세비군 2010.05.26
XE내에 있는 JW Media Player 업그레이드 하기 [8] 세비군 2010.05.26
CSS 문구를 쉬운 말로 설명해 드립니다 [2] 레미짱 2010.05.26
나의 웹사이트가 어떻게 보이는지 보여 줍니다. [2] 레미짱 2010.05.21
1.4.2.0, 1.4.2.1 패치후 레이아웃 깨지시는 분들 참고하세요. [3] 위드파트너 2010.05.19
XE 판올림과 관련하여 일반 사용자분들께 드리는 당부 [7] file ----------- 2010.05.19