Hizmetlerimiz hakkında bilgi almak için tıklayın.

Web geliştirme sürecinde hem tasarım hem de kodlama aşamasında renkler oldukça önemlidir. Tasarımcıların belirlediği renklerin kodlama aşamasında doğru bir şekilde kullanılması web sitesinin kalitesini arttırır. Bu noktada document.body.style.BackgroundColor özelliği devreye girer.

Document.body.style.BackgroundColor özelliği, JavaScript dilinde kullanılan bir komuttur ve web sayfasının arka plan rengini belirlemek için kullanılır. Bu özellik aracılığıyla, web sayfasının arka plan rengi farklı renklere kolayca değiştirilebilir.

Örnek Kod:

<div>
    <button onclick="arkaplankirmizi()">Beyaz Yap</button>
</div>
<script>
    function arkaplankirmizi() {
        document.body.style.backgroundColor = "red";
    }
</script>

Yukarıda ki örnekte bir div içerisinde bir buton oluşturulmuş, butona ise "onclick" özelliği verilerek, tıklandığı zaman çalıştırması gereken JavaScript kodu eklenmiştir. Eğer bir resmin üzerine mouse ile temas ettiğinizde veyahut bir metinin üzerine mouse ile temas ettiğinizde değişmesini isterseniz "onmouseover" kullanmalısınız.

Bu özellik sayesinde web sayfalarının arka plan rengi, markanızın renklerine uygun veya site amacına uygun olarak değiştirilebilir. Örneğin, bir moda blogu için pastel renkleri tercih edebilirsiniz ya da teknoloji odaklı bir site için daha koyu renkleri kullanabilirsiniz.

Arkaplan resim değiştirme makalesi için tıklayınız...

KODLAR

See the Pen Untitled by EnesAlp (@enesalpcomtr) on CodePen.