CSS3 ile Gradient Arkaplan Nasıl Oluşturulur?

CSS ile renk geçişi yani gradient CSS3 ile birlikte gelen yeni bir özelliktir. Resim kullanmadan bir renkten diğerine geçiş yapmayı sağlayan css3 gradient özelliği bize tasarım yönünden çok büyük kolaylık sağlar. Üstelik resim kullanmadığımız için HTTP isteği yapmamış oluruz ve böylelikle görüntü hızlı açılır.

Renk geçişi resimleri genelde jpeg olarak kaydedilir, resimde fazla renk olduğu için, bazen bu renk geçişi resimleri yüksek boyutlarda olabilir. CSS3’ün bu özelliği ile resmin yerini kod blokları alır ve buda bize hız kazandırır.

Şimdi CSS3 ile gradient arkaplan nasıl oluşturulur, öğrenelim. Bunun için aşağıdaki kod satırını kullanabilirsiniz:

[css]

background:-webkit-gradient(linear, 76% 26%, 10% 21%, from(#866400), to(#FFD500))

[/css]

Yukarıdaki kod satırında linear renk geçişini kullandım. Ayrıca #866400 renk kodundan #FFD500 renk koduna geçişi sağladım.