»
Tiếng AnhTiếng PhápTiếng Việt

In - 3D - Đổ bóng cho chữ - JavaScriptBank.com

Phiên bản đầy đủ: jsB@nk » Chữ » 3D - Đổ bóng cho chữ
URL: https://www.javascriptbank.com/3d-text-all.html

3D - Đổ bóng cho chữ © JavaScriptBank.comHiệu ứng thực hiện việc đổ bóng cho chữ ở dạng tĩnh theo nhiều kiểu khác nhau tạo nên các kiểu chữ theo góc nhìn 3D.

Phiên bản đầy đủ: jsB@nk » Chữ » 3D - Đổ bóng cho chữ
URL: https://www.javascriptbank.com/3d-text-all.html



CSS
<style>body { background:silver; font-family:Arrus BT,Garamond,Times New Roman; }div { position:absolute; }</style><style>a { text-decoration: none; color:maroon; vlink:maroon; alink:red;}a:hover {color: red }.info { font-family:Times New Roman; positon:relative;}.light { top:-1; left:-1; color:white;}.shade { top:+1; left:+1; color:pink; }.fill { top:0; left:0; color:red; } </style><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


HTML
<div class="info"><div class="light"><i>JavaScriptBank.com</i></div><div class="shade"><i>JavaScriptBank.com</i></div><div class="fill"><i><a href="http://JavaScriptBank.com"onmouseover="status='http://JavaScriptBank.com'; return true;"onmouseout="status='Emboss & 3D Letters'; return true;">JavaScriptBank.com</a></i></div></div><br><br><br><!--- Example #1 ---><style>.shade1 { top:+5; left:+5; color:black; }.fill1 { top:0; left:0; color:red; }</style><div class=Example1><div class="shade1"><center><h1>Shadow</h1></center></div><div class="fill1"><center><h1>Shadow</h1></center></div></div><br><br><br><!--- Example #2 ---><style>.light2 { top:-1; left:-2; color:white; }.shade2 { top:+1; left:+2; color:black; }.fill2 { top:0; left:0; color:silver; } </style><div class=Example2><div class="light2"><center><h1>Emboss Background Example</h1></center></div><div class="shade2"><center><h1>Emboss Background Example</h1></center></div><div class="fill2"><center><h1>Emboss Background Example</h1></center></div></div><br><br><br><!--- Example #3 ---><style>.light3 { top:-2; left:-2; color:white; }.shade3 { top:+2; left:+2; color:lightblue; }.fill3 { top:0; left:0; color:blue; } </style><div class=Example3><div class="light3"><center><h1>Emboss Color Example</h1></center></div><div class="shade3"><center><h1>Emboss Color Example</h1></center></div><div class="fill3"><center><h1>Emboss Color Example</h1></center></div></div><br><br><br><!--- Example #4 ---><style>.light4 { top:-2; left:-2; color:yellow; }.shade4 { top:+2; left:+2; color:yellow; }.fill4 { top:0; left:0; color:darkgreen; } </style><div class=Example4><div class="light4"><center><h1>Color Highlight Example</h1></center></div><div class="shade4"><center><h1>Color Highlight Example</h1></center></div><div class="fill4"><center><h1>Color Highlight Example</h1></center></div></div><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->