Emirhan Bülbül

Css İle 3d Yazı Yazmak

Merhaba kodcu arkadaşlarım. Bu yazımda css ile 3d yazı efekti vermeyi anlatmaya çalışacağım. Efekt tam olarak üstteki resim gibi olacak. (Bu arada “dipcukadam” benim kullanıcı adım.)

Aşağıdaki kodları stil dosyanıza ekleyin.

.baslik{
font: 900 100px/1 'Source Sans Pro', Arial, sans-serif;
color: #fff;
text-align: center;
text-shadow: 0 1px 0 hsl(174,5%,80%),
0 2px 0 hsl(174,5%,75%),
0 3px 0 hsl(174,5%,70%),
0 4px 0 hsl(174,5%,66%),
0 5px 0 hsl(174,5%,64%),
0 6px 0 hsl(174,5%,62%),
0 7px 0 hsl(174,5%,61%),
0 8px 0 hsl(174,5%,60%),

0 0 5px rgba(0,0,0,.05),
0 1px 3px rgba(0,0,0,.2),
0 3px 5px rgba(0,0,0,.2),
0 5px 10px rgba(0,0,0,.2),
0 10px 10px rgba(0,0,0,.2),
0 20px 20px rgba(0,0,0,.3);}

Yazı boyutu nasıl değiştirilir ?

Yazı boyutunu değiştirmek için font: 900 100px/1 yazan kısımdan 100px‘i kendinize göre ayarlayabilirsiniz.

Yazı rengi nasıl değiştirilir ?

Yazı rengini değiştirmek için de color: #fff; yazan kısımı kendinize göre düzenleyebilirsiniz.

Umarım faydalı bir yazı olmuştur. Bir sonraki yazımda görüşmek üzere.

Yorum Yap

Elektronik Sigara E Sigara Likit Smok takipçi satın al