div-css bilmeniz gereken kodlar

#1 13-11-2007, 11:15

div-css bilmeniz gereken kodlar
artık web sayfaları tableless (tablosuz) olarak kodlanmaya başlandı. ama gerek tarayıcı farklılıklarından gereksede div'in tablo kadar esnek olmayışı acemi kullanıcılara büyük sorunlar yaşatıyor.

bu başlık altında genel anlamda kullanılabilecek div-css kodlar paylaşılacak. mini bir kütüphane gibi. yalnız burada paylaşılacak olan kodlar "şu divi tamda şu kısma yerleştirmem gerek nasıl yaparım?" sorularının cevabı olmayacak. sayfamı nasıl ortalarım, nasıl scrollbar'lı div yaparım yada sayfamı nasıl yukarıya yapıştırabilirimin cevapları bu başlık altında toplanacak.

tartışmaya açık konular değilde, sadece artık kalıplaşmış çözümler bu başlık altında toplanacak. benim şu an aklıma gelenler bunlar. hatırladıkça eklemeler yapacağım. sizlerde başlığı destek çıkarsanız kısa zamanda elimizde güzel bir mini kütüphanemiz olur.

sayfanızı yukarıya yapıştırmak için:

PHP Kodu:

body
{
margin-top: 0px;
}

div içinde scrollbar:

1. kaydırma çubukları sürekli görünen: (overflow: scroll)

PHP Kodu:

.div1
{
overflow: scroll;
height: 100px;
width: 100px;
}

<div class="div1">asd asasd asdsad asd asd d<br /><br /><br /><br /><br /><br /><br /></div>

2. kaydırma çubuğu yazı alanı taşınca görünen: (overflow: auto)
PHP Kodu:

.div1
{
overflow: auto;
height: 100px;
width: 100px;
}

<div class="div1">asd asasd asdsad asd asd d</div>

yan yana div kutular: (float)

1. sola dayalı: (float: left

PHP Kodu:

.div2
{
border: solid 1px black;
float: left;
height: 100px;
width: 100px;
}

<div class="div2">1</div>
<div class="div2">2</div>
<div class="div2">3</div>

2. sağa dayalı: (float: right)

PHP Kodu:

.div2
{
border: solid 1px black;
float: right;
height: 100px;
width: 100px;
}

<div class="div2">1</div>
<div class="div2">2</div>
<div class="div2">3</div>

div'i sayfaya göre ortaya almak: (margin-left: auto; margin-right: auto; ikisi bir arada kullanılmalı)

PHP Kodu:

.div3
{
border: solid 1px black;
height: 100px;
margin-left: auto;
margin-right: auto;
width: 100px;
}

<div class="div3"></div>

~~B737~~ · #2 16-11-2007, 10:33

eline sağlık bu tür konular çok yararlı oluyor gerçekten işte WS farkı

baris · #3 18-11-2007, 12:52

Ben Bİr İŞ Anlayamadim!! Bu Nasi??

#4 18-11-2007, 12:55

sayfamı nasıl ortalarım, nasıl scrollbar'lı div yaparım yada sayfamı nasıl yukarıya yapıştırabilirimin cevapları bunlar......

Benzer Konular
Konu	Konu Açanlar	Forum	Cevaplar	Güncel Mesajlar
Html Kodlar Süper Kodlar Burada	becerikliforum	Ücretsiz uzantılı siteler	0	02-07-2008 07:11
webmasterların kullanması gereken kodlar	kadınca	Webmaster Genel Konular	1	25-01-2008 03:59
ALAN ADI(DOMAIN) hakkında bilmeniz gereken temel bilgiler	kadınca	Web Dersleri	0	16-01-2008 12:08
BARINDIRMA(HOSTING) hakkında bilmeniz gerekenler	kadınca	Web Dersleri	0	16-01-2008 12:06
Host Alırken Gereken Bilgiler ve Dikkat Edilmesi Gereken Noktalar	Ra_eM	Makaleleriniz	0	30-10-2007 11:01

Seçenekler
Yazdırılabilir şekli göster Sayfayı E-Mail olarak gönder