CSS serimize devam ediyoruz bu derste paddingi işleyecez.Padding ne önce ondan başlayalım.Padding iç boşluk anlamına geliyo.Yani verdiğimiz değer kadar 4 köşesinden iç boşluk veriyo.
Yukarda solda olan normal bir kutu.Sağdakide padding verilmiş bir kutu.Padding verdiğimizde objenin boyutu büyüyo ve iç boşlukları oluşuyo.Kodlara geçelim.
.buton{padding:5px;}
.buton{padding:25px;}
Marginde olduğu gibide bunda da tek tarafa padding veremek isteyebiliriz bunun için kodlarımız var.
padding-left =sol için
padding-right = sağ için
padding-top = üst için
padding-bottom =alt için
Kodlara geçelim.
.icerik{padding-left:10px;padding-top:25px;}
.icerik{padding-bottom:5px;}
Genel örnek :
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
.buton{width:60px;height:20px;padding:5px;background:#ddd;color:#999;border-radius:5px;-webkit-border-radius:5px; -moz-border-radius:5px; -o-border-radius:5px; }
</style>
</head>
<body>
<div class="buton">Anasayfa</div>
</body>
</html>
UstaDerslik
