CSS 

CSS Kodlamaya Giriş –2

\"css-kodlama\"Daha önce burada yazı dizimize başlangıç yapmıştık.

1. Padding & Margin

Yeni başlayanlar padding ve margin etiketlerini karıştırabilir veya yanlış kullanabilirler. Öncelikle tanımlarını yapayım.

Padding: Elemanın kenar içi boşluğudur.

Margin: Elemanın kenar dışı boşluğudur.

Daha kolay anlayabilmek için aşağıdaki görsele göz atın:

\"1_a\"

Şimdi, kafanızda daha net şekillenmiştir. Gelelim padding ve margin değerlerinin nasıl verileceğine… Bunun için aşağıdaki görsele göz atın:

\"1_c\"

ÖRNEK: <h2> etiketli ile biçimlendirilmiş bir başlık ve gördüğünüz gibi margin ve padding, paragraflar arasında boşluk oluşturmuş.

\"1_b\"

Margin ve Padding Değerleri

Yukarıdaki örnek görseli inceleyelim. Buradaki başlığın, margin ve padding değerleri şunlar olacak:

margin: 15px 0 15px 0;
padding: 15px 15px 15px 15px;

Bu kod satırını daha iyi optimize edebiliriz: Şöyle ki:

margin: 15px 0;  / *-- üst ve alt = 15px | sağ ve sol = 0 --* /
padding: 15px;  / *-- üst, sağ, alt ve üst = 15px --* sol /

Bu başlık için tam olarak CSS kodlamasını şöyle yazabiliriz:

h2 {
background: #f0f0f0;
border: 1px solid #ddd;
margin: 15px 0;
padding: 15px;
}


Emrah

1981 Samsun doğumlu ve Gazi Üniversitesi, Bilgisayar ve Öğretim Teknolojileri Eğitimi mezunu. Bilişim Teknolojileri Öğretmeni olarak görev yapmakta olup DMOZ Editörü, Web-Grafik Tasarımı ve SEO eğitmeni.

Bunları da sevebilirsiniz

Yorum Yap

umraniye ankara
mersin escort ümraniye escort kadıköy escort sisli escort kadıköy escort bayan beylikdüzü escort ümraniye escort mugla escort kartal escort ataşehir escort şirinevler escort ümraniye escort
porn izle kartal escort beşiktaş escort ataköy escort rus escort