• Ana Sayfa
  • Portal
  • Arama
  • Üye Listesi
  • Yetkili Listesi
  • Diğer

  • GrafikArşivine | Hoşgeldiniz.

    Ziyaret ettiğiniz için teşekkür ederiz aramıza katılıp bize destek olmak istermisiniz?
    Konuyu Oyla:
    • Derecelendirme: 0/5 - 0 oy
    • 1
    • 2
    • 3
    • 4
    • 5
    Dream41 Dream41 Dream41 Dream41 Dream41 CSS İle Renk Değiştiren Yazı Yapımı
    CSS CSS hakkında paylaşımların yapıldığı bölüm. Dream41 Yazar, 1 Yorum , 287 Okuma
    Çevrimiçi Dream41
     Tarih: 13-09-2018, Saat: 00:06
    #1
    Merhaba arkadaşlar bu yazımızda sizlere renk değiştiren yazı yapmayı anlatıcam ilk önce demo verelim.

    Kod:
    https://codepen.io/dream41/pen/QVrxJp
    CSS: Kodlarımız:

    Kod:
    .renkdegis {
       color: white; <- Yazının ana rengi
       -webkit-animation-name: text;
       animation-name: text; <- animasyon adı istediğinizi yaza bilirsiniz.
       -webkit-animation-duration: 4s; <- Renk değişme hızı
       animation-duration: 4s; <- Renk değişme hızı
    -- Animasyon özellikleri yani renk değiştirmi işlemini yapmak için gerekli kodlar.
       -webkit-animation-iteration-count: infinite;
       animation-iteration-count: infinite;
       -webkit-animation-direction: alternate;
       animation-direction: alternate;
       -webkit-animation-timing-function: ease-in-out;
       animation-timing-function: ease-in-out;
    }

    --Renk ayarları.--

    @-webkit-keyframes text {
       0%   {color:#ff1744;}
       25%  {color:#6a1b9a;}
       50%  {color:#1e88e5;}
       75%  {color:#00c853;}
       100% {color:#ff1744;}
    }

    @keyframes text {
       0%   {color:#ff1744;}
       25%  {color:#6a1b9a;}
       50%  {color:#1e88e5;}
       75%  {color:#00c853;}
       100% {color:#ff1744;}
    }


    HTML kodlarımız:
    Kod:
    <div class="renkdegis">Dream41</div>
    Yada:
    <span class="renkdegis">Dream41</span> Şeklinde yapabilirsiniz sizin tercihinize kalmış.
    [Resim: grafiklogoss.png]
    Cevapla
    Teşekkür verenler:
    Çevrimiçi ByGold
     Tarih: 06-04-2019, Saat: 07:04
    #2
    Elinize Saglik
    Ara
    Cevapla
    Teşekkür verenler:

    Yorum yapma izniniz bulunmuyor!

    Yorum yapa bilmek için giriş yapmalısınız veya üye olmalısınız

    Giriş yap!

    Zaten hesabın var mı? Giriş yap.
    Giriş

    Kayıt ol!

    Bize katılmak için üye olunuz.
    Kayıt

    Hızlı Menü:


    Konuyu Okuyanlar: 2 Ziyaretçi

    Hakkımızda

    GrafikArşivi 4 Eylül 2018 tarihinde açılmış olup sizlerin destekleri ile büyümeye devam etmekte.

    İletişim

    İletişim sayfamızı kullanabilirsiniz.

    - ya da -
    Türkçe Çeviri: MCTR, Yazılım: MyBB, © 2002-2019 MyBB Group.
    selam