티스토리 뷰

컴퓨터/프로그래밍/기타

자바 스크립트 텍스트 효과 태그

Rough Existence 2008. 1. 24. 00:16

브라우저 호환성 때문에 flex나 실버라이트로 화면 구성이나 제어하는 세상이지만...

그래도 구식 방법으로 이펙트를 줘야 할대도 있으므로....

 

글 자 모 양 태 그 소 스                             
기본글자 태그
<★font color="000000"> 기본글자 태그
진하게 쓰기
진하게 쓰기
빨간색 글자
빨간색 글자태그
글자태그
 글자태그
굵고 진하게
 <★font color=blue" face=휴먼옛체 size=4> 굵고 진하게
그림자 글자(1)
 <★SPAN style="COLOR:black;FILTER:shadow(color=dcdcdc);height:5px"> 그림자 글자(1)
그림자 글자(2)
 <★span style="COLOR:blue;FILTER:shadow(color=#dcdcdc);height:5px"> 그림자 글자(2)
그림자 글자(3)
 <★span style=filter:shadow(color=c0c0c0);height:1px> 그림자글자 태그(3)
그림자글자(4)
 <★span style="font-family:돋움;font-size:10pt;font-weight:bold;color:#ff7404;width:100%;height:23;Filter:Shadow(color=#ff9e2e,direction=125)"> 그림자 글자 (4)
그림자 글자(보라색)
<★span style="color:White; width:100%; height: 12; font-size:10pt; Filter: shadow (color=660099,direction=135)"★> 그림자 글자(보라색)
그림자 글자(검은색)
<★span style="color:White; width:100%; height: 12; font-size: 10pt; Filter: shadow(color=black,direction=135)"> 그림자 글자(검은색)
그림자 글자(하늘색)
<★span style="color:White; width:100%; height: 12; font-size: 12pt; Filter: shadow(color=3399ff,direction=135)"> 그림자 글자(하늘색)
☆★..그림자글자
<★span style=color:#a52a2a;filter:shadow(color=#FFc0cb);height:3px> ☆★.. 그림자글자..★☆
음영글씨-번짐
<★span style="color:ffffff;FILTER:glow(color=green);height:14px"> 음영글씨-번짐글자
음영글자-번짐
<★span style="color:ccffcc;FILTER:glow(color=ffao7a);height:14px"> 음영글자-번짐글자
음영글자-번짐
<★span style="color:ffffff;FILTER:glow(color=9400de);height:14px"> 음영글자-번짐글자
음영글자-번짐
<★span style="color:ffffff;FILTER:glow(color=#008b8b);height:14px"> 음영글자-번짐글자
음영글자-번짐
<★span style="color:ffffff;FILTER:glow(color=#800000);height:14px"> 음영글자-번짐글자
(빨간)바탕글자
<★span style=font:10pt;color:white;background-color=red>빨간바탕글
(녹색)바탕글자
<★span style=font:10pt;color:white;background-color=green>녹색바탕글
(진노랑)바탕글자
<★span style=font:10pt;color:white;background-color=ffcc00>진노랑바탕
(보라)바탕글자
<★span style=font:10pt;color:white;background-color=9966ff>보라색바탕
(주황)바탕글자
<★span style=font:10pt;color:white;background-color=ff6633>주황바탕글
(하늘)바탕글자
<★span style=font:9pt;color:white;background-color=3399ff>하늘색바탕
이중글자 태그
 <★span style=filter:dropshadow(color=99cc99,offy=3);height:15px;> 이중글자 태그
이중글자
<★span style=filter:dropshadow(color=dcdcdc,offy=3);height:15px;> 이중글자 태그
테두리 글자.1
<★span style="font-family:휴먼매직체;font-size:12pt;color:ffffe6;width:100%;height:20;Filter:Glow(color=006363,strength:2)">테두리 글자 태그.1
테두리 글자.2
<★span style="color:white; filter:glow(color:blue); height:28px"> 테두리글자.2
테두리 글자.3</STYLE< TD>
<★span style="font-size:10pt;color:white;width:100%;height:20;Filter:Glow(color=red,strength:2)"> 테두리 글자.3</STYLE
풍경(風磬)
 <★span style=" width:100%; height: 20; font-size: 14pt; color: #FFFFFF; valign:bottom;Filter: glow (color=blue,strength:2);font-weight:none; "> 풍경(風磬)/글자태그.5
입체감_1
<★span style="font-weight:none; color:skyblue; width:100%; height: 30; font-size: 18pt; Filter: shadow(color=blue,direction=135)"> 입체감 글자_1

입체감_2

 <★SPAN style="COLOR:dddddd;FILTER:shadow(color=000000);height:10px">

입체감_2
입체감3
 <★div style="width=100;height:25;font-size:18pt;color:red;filter:shadow(direction=45)">입체감 글자 (3)
입체감_4
<★span style="font-weight:none; color:skyblue; width:100%; height: 30; font-size: 18pt; Filter: shadow(color=navy,direction=135)"> 입체감 글자_4
입체감_5
<★span style="font-weight:none; color:cccc99; width:100%; height: 30; font-size: 18pt; Filter: shadow(color=006400,direction=135)"> 입체감 글자_5
글자색의 기호
#dc143c    #ff1493   #a0522d   #b22222   #2e8b57     #808000   
#800080   #00ffff #00bfFf   #808080   #ffd700      #32cd32