728x90 AdSpace

  • Latest News

    2/18/2012

    CSS3 Text-Shadow Özelliği ile Gölge Efektleri

    CSS3 ile daha önceleri Photoshop yada diğer programlar ile text üzerinde yapılan bir çok efektti program kullanmadan yapmak mümkün görünüyor... Şimdi Text-Shadow özelliğinin kullanımına ve hazırlanmış bir kaç örnek çalışmaya bakalım...

    Ufak bir video da çekmiştim...

    How the CSS text-shadow property works

    Şimdi gelelim neler yapabileceğimize:
    1. Vintage / Retro text effect

    Vintage text-shadow effect


    text-shadow: 5px 5px 0px #eee, 7px 7px 0px #707070;

    2. Neon text effect

    Neon text-shadow effect

    text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #ff00de, 0 0 70px #ff00de, 0 0 80px #ff00de, 0 0 100px #ff00de, 0 0 150px #ff00de;

    3. Inset text effect

    Inset text-shadow effect

    text-shadow: 0px 2px 3px #666;

    4. Fire text effect

    Fire text-shadow effect

    text-shadow: 0 0 20px #fefcc9, 10px -10px 30px #feec85, -20px -20px 40px #ffae34, 20px -40px 50px #ec760c, -20px -60px 60px #cd4606, 0 -80px 70px #973716, 10px -90px 80px #451b0e;

    5. Board Game text effect

    Board Game text-shadow effect

    text-shadow: 10px 10px 0 #ffd217, 20px 20px 0 #5ac7ff, 30px 30px 0 #ffd217, 40px 40px 0 #5ac7ff;

    Tüm örneklerin Çalışır halini görmek için Tıklayın: Örnek uygulamlar kynak: line25.com

    Mehmet Ali

    Grafik tasarım konusunda bir şeyler öğrenmekte, öğrenmekte olduklarını paylaşmakta.

    Website: Mhmtalizm

    • Blogger Yorumları
    • Facebook Yorumları

    0 yorum:

    Yorum Gönder

    Item Reviewed: CSS3 Text-Shadow Özelliği ile Gölge Efektleri Rating: 5 Reviewed By: Kirli Adam
    Scroll to Top