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, Yazar, WebMaster, Blogger, SEO eğitmeni. Araştırmacı, sinema sever, fitness yapar, farklı doğal güzellikleri keşfetmeye bayılır.

Yorum Yap

escort akdeniz escort mezitli çamlıyayla escort escort toroslar escort tarsus escort gulnar escort erdemli escort silifke escort mut mersin escort mersin escort bayan porno izle porno hikayeler