Özet görüntüleri, saat kaçta, hangi kanalda » CSS Tasarım

CSS’de div class ve div id örnekleri

admin — Sat, 13 Mar 2010 12:45:15 +0000

CSS’de sıkça sorulan sorular arasından her gün yeteneğim çerçevesinde birini seçip sizleri bilgilendirmeye çalışıyorum. Tasarım konusunda CSS, html ile birlikte kullanılan, yardımcı ve gerekli bir uygulamadır. İçerisinde matematiksel formüller bulundurmayan CSS, kodlama değil tasarım dilidir.

CSS’de div class ve div id arasındaki farklar nelerdir?
Aslında sıkça sorulan sorular bölümüne de eklenmesi gereken bir konudur, div class ve div id arasındaki farklar…
Div class, sayfada defalarca kullanılabilirken div id yalnızca bir kez kullanılabilir. Bu, iki tag’ı ayırt edici en önemli özelliktir.

Örnek vermek gerekirse;

#ust_kisim {
width: 300px;
height: 200px;
}

# – Diyez işareti div id için kullanılır. ” . ” ise div class için…

Verilen kodu css’e girip html’den çağırmak istediğimizde;

..

Şeklinde çağırabiliriz. Bu tag ile işimiz artık bitmiş olmalıdır. Aksi halde XHTML’ye uygun bir site yapmamış olursunuz bunun da CSS olarak bir anlamı kalmaz, doğru bir görüntü etseniz de yanlış bir tasarım yapmış olursunuz… İleride sizden başka o css ile uğraşacak kişileri zora sokarsınız…

CSS’de div class kullanımı da benzer şekildedir.

.sol_menu {
herhangi bir bilgi
}

CSS’e kaydedilir ve html sayfadan

herhangi bir şey

Şeklinde çağırılır.
CSS’de div class ve div id örnekleri böylece verilmiş olup yazının sonuna gelinmiştir. Anlamadığınız ya da ilerletilmesini istediğiniz konular varsa yorum bölümünden bize ulaşabilir, bu yolda bize yardımcı olabilirsiniz…

CSS’de margin ve padding arasındaki farklar, margin ve padding örnekleri

admin — Wed, 10 Mar 2010 23:14:15 +0000

CSS kullanan birçok kişi, margin ve padding’i en azından ilk kullanımda merak eder. En nihayetinde bu iki komutta benzer bir işi başarmaktadır, boşluk vermek… Margin ve padding arasındaki fark nedir sorusunun yanıtı da aslında burdan yola çıkarak verilebilir. Margin, elementin kenarına boşuk verir. Padding ise içeriğin kenarına boşluk verir.
Örneğin; Bir yazı yazdınız, bunun yanına başka bir yazı gelirken dikkat edilmesini istiyorsanız padding komutunu kullanırsınız… Eğer ki sitemizde bulunan ” ana sahife ” ve ” maliye burcu ” bölümleri gibi iki şeyin birbirine uzaklığını ayarlamak istiyorsanız bu sefer de margin komutunu kullanırsınız…

Margin’in örnek kullanımı;

#margin-ornek {
margin: 10px 5px 5px 10px;
}

Bu işlem sırasıyla elementimizin üstünden 10 piksel, sağ kenarından 5 piksel, alt kenardan 5 piksel ve sol kenardan 10 piksel boşluk vermektedir.

Padding için bir örnek vermek gerekirse…

#padding-ornek {
padding: 10px 10px 10px 10px;
}

Bu da içeriğin 4 kenarına da 10′ar piksel ara vermektedir.

CSS’de arkaplan resmini sabit tutma

admin — Tue, 09 Mar 2010 22:31:16 +0000

CSS’de önemli sorunlardan biri de arkaplandır. Genelde sorulan soruları bulup sitemizde yayınlıyoruz. Böylece aramalarda güzel sonuçları yakalamaya çalışıyoruz. Sitelerde bir arkaplan resmi oluşturular ama alta doğru gidince bu resim gelmez ya da benzer sorunlar olur. Bunu engellemek için body bölümünün içine ya da ayrı olarak verdiğimiz kodu eklediğinizde sorun kalmıyor. Her yerde fix bir arkaplan resmi yakalıyorsunuz, bu da sizin için güzel oluyor elbette…

body {background:url(resim.png) no-repeat fixed;}

Bu kod ile arkaplanı fixlersiniz. Bu kod sorununuzu aşamadıysa yorum bölümünü kullanarak bize ulaşabilirsiniz…