24 Eylül 2018 Pazartesi
Twitter

Otomatik doldurma alanlarının arka planlarını ayarlama

Tarayıcınız input elemanlarını otomatik doldurduğunda arka planını sarı renge (çoğunlukla) ayarlar. Ancak bunu değiştirme şansımız var...

Siz de benim gibi form elemanlarınızın, tarayıcılar tarafından otomatik doldurulduğunda arka planının renginin değişmesini istemiyorsanız şu css kodlarını kullanabilirsiniz:

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-animation: autofill 0s forwards;
    animation: autofill 0s forwards;
}

@keyframes autofill {
    100% {
        background: inherit;
        color: inherit;
    }
}

@-webkit-keyframes autofill {
    100% {
        background: inherit;
        color: inherit;
    }
}

background: inherit; yazan yerleri istediğiniz bir renk ile değiştirebilirsiniz. :)

Örnekleri inceleyiniz:

CSS uygulanmamış form:
https://codepen.io/daltinkurt/pen/GQLBex

CSS uygulanmış form:
https://codepen.io/daltinkurt/pen/ZrZjZE

 

Değerlendirme

Yazım dilinin sadeliği ve anlaşılabilirliği Puan: 5,00 (1 oy)
Yazıdaki kodların kalitesi Puan: 4,83 (2 oy)
İhtiyaca cevap verme Puan: 5,00 (2 oy)
Tavsiye edilebilirlik Puan: 4,83 (2 oy)
Genel değerlendirme Puan: 4,88 (2 oy)
Puanlamalar 5 üzerindendir.
  • Site Yorumları
  • Facebook Yorumları Facebook Yorumları
Yeni yorum yaz
Henüz bir yorum yazılmadı. İlk yazan siz olabilirsiniz.