logo

CSS Arka Planı

CSS arka plan özelliği, öğe üzerindeki arka plan efektlerini tanımlamak için kullanılır. HTML öğelerini etkileyen 5 CSS arka plan özelliği vardır:

  1. arka plan rengi
  2. arka plan görüntüsü
  3. arka plan tekrarı
  4. arka plan eki
  5. arka plan konumu

1) CSS arka plan rengi

Arka plan rengi özelliği, öğenin arka plan rengini belirtmek için kullanılır.

Arka plan rengini şu şekilde ayarlayabilirsiniz:

 h2,p{ background-color: #b0d4de; } <h2>My first CSS page.</h2> <p>Hello Javatpoint. This is an example of CSS background-color.</p> 
Şimdi Test Edin

Çıktı:

İlk CSS sayfam.

Merhaba Javatpoint. Bu, CSS arka plan renginin bir örneğidir.


2) CSS arka plan resmi

Arka plan resmi özelliği, bir resmi bir öğenin arka planı olarak ayarlamak için kullanılır. Varsayılan olarak görüntü öğenin tamamını kapsar. Bunun gibi bir sayfa için arka plan resmini ayarlayabilirsiniz.

 body { background-image: url(&apos;paper1.webp&apos;); margin-left:100px; } 
Şimdi Test Edin

4) CSS arka plan eki

Arka plan eki özelliği, arka plan resminin sabit olup olmadığını veya tarayıcı penceresinde sayfanın geri kalanıyla birlikte kaydırılıp kaydırılmayacağını belirtmek için kullanılır. Arka plan resmini sabit olarak ayarladıysanız, tarayıcıda kaydırma sırasında resim hareket etmeyecektir. Sabit arka plan görüntüsüne sahip bir örnek ele alalım.

 background: white url(&apos;bbb.webp&apos;); background-repeat: no-repeat; background-attachment: fixed; 
Şimdi Test Edin

5) CSS arka plan konumu

Arka plan konumu özelliği, arka plan görüntüsünün başlangıç ​​konumunu tanımlamak için kullanılır. Varsayılan olarak arka plan resmi web sayfasının sol üst kısmına yerleştirilir.

Aşağıdaki konumları ayarlayabilirsiniz:

  1. merkez
  2. tepe
  3. alt
  4. sol
  5. Sağ
 background: white url(&apos;good-morning.webp&apos;); background-repeat: no-repeat; background-attachment: fixed; background-position: center; 
Şimdi Test Edin