Konuyu Oyla:
  • Derecelendirme: 0/5 - 0 oy
  • 1
  • 2
  • 3
  • 4
  • 5
Css ile 3 Boyutlu (3d) Yazı
#1
Merhaba arkadaşlar,

Css ile 3d yazı yazmak için güzel bir stil örneği...

[Resim: 5l3l6nnj.png]

Kod:
<style>
.UcDtext{
 color: #FFF;
 font: 900 100px/1 'Source Sans Pro', Arial, sans-serif;
 text-align:center;
 text-shadow: 0 1px 0 #ccc,
 0 2px 0 #c9c9c9,
 0 3px 0 #bbb,
 0 4px 0 #b9b9b9,
 0 5px 0 #aaa,
 0 6px 1px rgba(0,0,0,.1),
 0 0 5px rgba(0,0,0,.1),
 0 1px 3px rgba(0,0,0,.3),
 0 3px 5px rgba(0,0,0,.2),
 0 5px 10px rgba(0,0,0,.25),
 0 10px 10px rgba(0,0,0,.2),
 0 20px 20px rgba(0,0,0,.15);
}
</style>

Kullanım:


Kod:
<div class="UcDtext">
Turkishcode.com
</div>



Örnek Sayfa :


Kod:
<!Doctype html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Css 3D Text</title>
<style>
.UcDtext{
 color: #FFF;
 font: 900 100px/1 'Source Sans Pro', Arial, sans-serif;
 text-align:center;
 text-shadow: 0 1px 0 #ccc,
 0 2px 0 #c9c9c9,
 0 3px 0 #bbb,
 0 4px 0 #b9b9b9,
 0 5px 0 #aaa,
 0 6px 1px rgba(0,0,0,.1),
 0 0 5px rgba(0,0,0,.1),
 0 1px 3px rgba(0,0,0,.3),
 0 3px 5px rgba(0,0,0,.2),
 0 5px 10px rgba(0,0,0,.25),
 0 10px 10px rgba(0,0,0,.2),
 0 20px 20px rgba(0,0,0,.15);
}
</style>
</head>
<body>
<div class="UcDtext">
Turkishcode.com
</div>
</body>
</html>
Cevapla


Hızlı Menü:


Konuyu Okuyanlar: 1 Ziyaretçi