CSS ile Arkaplan Resmi Değiştirme Nasıl Yapılır?

CSS ile Arkaplan Resmi Değiştirme Nasıl Yapılır? Merhaba sevgili okurlar, Final sınavlarımdan Ötürü uzun bir süre ayrı kaldık bu süre zarfında sizlere ne bir ders ne de bilgilendirici bir makale sunabildim. Hazır tatile de girmişken daha çok fazla bilgi alışverişinde bulunacağız. Bugünkü dersimiz css. Konusu ise css kodları ile sitemizin arkaplan resmini yerleştirmek ve lüzumlu ayarlamaları yapabilmek. Bazen sitelerimizin öğelerinin arkaplanına desen vermek isteriz. “Table”‘lara bunu yapmak kolaydı. WYSIWYG düzenleyicileri kolaylıkla bunu yapmamızı sağlıyorlardı. Peki ya sitemizin tamamına desen vermek istersek ne yapacağız? Css ile çok fazla basit bir kod kullanarak bunun üstesinden gelebiliriz. 1  body { 2  background-image: url(resimler/arkaplan.jpg); üç  background-repeat: repeat; 4  background-attachment: scroll; 5  background-color: white; altı  background-position: top-left; 7     } Bu tercih ettiğimiz kod sitemizi < body > seçicisine yukarıda belirttiğimiz nitelikleri kazandırır. Gelin biraz da özelliklerden bahsedelim. —————————————————————– background-image: Örnekte gördüğünüz benzeri arkaplan resmi şekilde “resimler” klasöründeki “arkaplan.jpg” resmini seçtiğimizi bu bilhassa belirtiyoruz. —————————————————————– background-repeat: Bu özellik ile arkaplan resmimizin tekrardan edip etmeyeceğini, Şayet edecekse x’mi yok ise y ekseninde mi edeceğini belirtiriz. Alabileceği değerler: repeat – Hem yan şekilde hem de alta doğru yeniden et repeat-x – yana doğru yine et repeat-y – aşağı doğru yeniden et no-repeat – tekrardan etme —————————————————————– background-attachment: Arkaplan sayfa ile yanında kaysın mı olmadan sabit mi kalsın ayarını bu alternatif ile yaparız. Bunun değerleri: scroll – sayfa ile kayar fixed – sabittir —————————————————————– background-color: Arkaplan resminin altında kalan alanların rengini, yani arkaplanın rengini belirlediğimiz özelliktir. —————————————————————– background-position: Arkaplan deseninin başlayacağı noktayı belirtir. Alabileceği değerler: top left – üst sol top center – üst orta top right – üst sağ center left – orta sol center center – ekranın ortası (hem üstten hem yandan) center right – orta sağ bottom left – alt sol bottom center – alt orta bottom right – alt sağ x-% y-% – yüzde şekilde sağ/sol ve üst/alt x-pos y-pos – x,y koordinatlarına göre


Yapılan Yorumlar
Erdem OFLAZ

Bir mum, diğer mumu tutuşturmakla ışığından bir şey kaybetmez.
 Kategoriler
 Popüler yazılar