Padding

CSS padding xususiyatlari kontent bo'ylab bo'sh joyni umumlashtirishda ishlatiladi. Margin xususiyatlari element kontenti va chegarasi o'rtasidagi oq bo'sh joy hajmini o'rnatish.

CSS padding

CSS padding xususiyatlari element kontenti va chegarasi orasidagi oq bo'sh joy hajmini belgilaydi.

Padding element kontenti(chegara ichidagi) atrofidagi joyni bo'shatadi.

...Padding elementning orqa fon rangi tomonidan ta'sir etiladi!

CSS bilan, siz paddingni to'liq ravishda nazorat qilishingiz mumkin. Bu yerda elementning har bir tarafi(yuqori, o'ng, past, va chap)ga padding o'rnatish uchun CSS xususiyatlari

Padding - Alohida tomonlar

CSS bir elementning har tomoniga padding joylashtirish uchun xususiyatlarga ega:

• padding-top(yuqori)
• padding-right(o'ng)
• padding-bottom(tub)
• padding-left(chap)

Hamma padding xususiyatlari quyidagi qiymatlarga ega bo'lishi mumkin:

length(uzunlik) - px, pt, cm va boshqalardagi paddingni bildiradi.

% - elementning kengligini % (foiz)idagi paddingni bildiradi.

inherit(meros) - paddingni ota elementdan ko'rinishi bir hil bo'lib qolganligini bildiradi

Quyidagi misol <p> elementning to'rt tomoni uchun turli hil paddinglarni o'rnatadi.

Namuna:

p {
  padding-top: 50px;
  padding-right: 30px;
  padding-bottom: 50px;
  padding-left: 80px;
}

Padding - Qisqacha(oson) xususiyati

Kodni kamaytirish uchun hamma padding xususiyatlarini bitta qilib olish mumkin.

Padding quyidagi alohida padding xususiyatlari uchun qisqacha xususiyat hisoblanadi:

padding-top
padding-right
padding-bottom
padding-left

Namuna:

p {
  padding: 50px 30px 50px 80px;
}

Bu yerda qanday uni ishlashi

Agar padding xususiyatini 4ta qiymati bo'lsa:

padding: 25px 50px 75px 100px;

yuqoridagi padding - 25px

o'ngdagi padding - 50px

pastdagi padding - 75px

chapdagi padding - 100px

Agar padding xususiyatini 3ta qiymati bo'lsa:

padding: 25px 50px 75px;

yuqoridagi padding - 25px

o'ngdagi va chapdagi paddinglar - 50px

pastdagi margin - 75px

Agar padding xususiyatini 2ta qiymati bo'lsa:

padding: 25px 50px;

yuqoridagi va quyidagi padding - 25px

o'ngdagi va chapdagi padding - 50px

Agar padding xususiyatini 1ta qiymati bo'lsa:

padding: 25px;

to'rttala paddinglar - 25px

Namuna:

div.ex1 {
   padding: 25px 50px 75px 100px;
}
div.ex2 {
   padding: 25px 50px 75px;
}
div.ex3 {
   padding: 25px 50px;
}
div.ex4 {
   padding: 25px;
}

Xususiyati & Tavsif