CSS'de padding Nedir?

CSS'de padding, bir HTML öğesinin içeriği ve sınırları arasındaki boşluğu kontrol etmek için kullanılan bir CSS özelliklerinden biridir. Padding, hem yatay hem de dikey olarak uygulanabilir ve içerik ile sınırlar arasındaki mesafeyi artırabilir veya azaltabilir.
Padding Özellikleri:
1. padding-top: Bu özellik, bir öğenin üst kısmındaki içerik ve sınırlar arasındaki mesafeyi belirler.
Örnek Kod:
div {
padding-top: 20px;
}
2. padding-right: Bu özellik, bir öğenin sağ tarafındaki içerik ve sınırlar arasındaki mesafeyi belirler.
Örnek Kod:
div {
padding-right: 30px;
}
3. padding-bottom: Bu özellik, bir öğenin alt kısmındaki içerik ve sınırlar arasındaki mesafeyi belirler.
Örnek Kod:
div {
padding-bottom: 10px;
}
4. padding-left: Bu özellik, bir öğenin sol tarafındaki içerik ve sınırlar arasındaki mesafeyi belirler.
Örnek Kod:
div {
padding-left: 15px;
}
Padding özelliklerinin farklı bir tanımlamada kullanımı:
div {
padding: 20px 30px 10px 15px;
}
Yukarıdaki örnek, padding özelliklerinin tümünü tek bir tanımlama ile belirtir. İlk değer üst, ikinci değer sağ, üçüncü değer alt ve dördüncü değer sol padding'i belirtir.
Padding özellikleri, HTML öğelerinin stilini belirlemek için çok kullanışlıdır. İçeriği ve sınırları arasındaki boşlukları kontrol etmenize ve öğelerinizi daha düzenli ve okunaklı hale getirmenize olanak tanır.