ویژگی padding CSS

تعریف و استفاده

ویژگی padding کوتاه‌نویسی برای تنظیم تمام پدیده‌های داخل‌کلیه در یک توضیح تنظیم می‌کند.

توضیح

این توضیح کوتاه‌نویسی برای تنظیم عرض تمام پدیده‌های داخل‌کلیه عنصر تنظیم می‌کند، یا برای تنظیم عرض پدیده‌های داخل‌کلیه روی هر سمت تنظیم می‌کند. پدیده‌های داخل‌کلیه روی عنصر درون‌ریز غیر جایگزین تأثیری بر محاسبه ارتفاع سطر ندارد؛ بنابراین، اگر یک عنصر همزمان دارای پدیده‌های داخل‌کلیه و پس‌زمینه باشد، ممکن است از دیدگاه بصری به سطرهای دیگر گسترش یابد و ممکن است با محتوای دیگر برخورد کند. پس‌زمینه عنصر از طریق پدیده‌های داخل‌کلیه گسترش می‌یابد. مقدار پدیده‌های داخل‌کلیه منفی مجاز نیست.

توضیح:مقدار منفی مجاز نیست.

مثال 1

padding:10px 5px 15px 20px;
  • پدیده‌های داخل‌کلیه بالا 10px هستند
  • پدیده‌های داخل‌کلیه راست 5px هستند
  • پدیده‌های داخل‌کلیه پایین 15px هستند
  • پدیده‌های داخل‌کلیه چپ 20px هستند

مثال 2

padding:10px 5px 15px;
  • پدیده‌های داخل‌کلیه بالا 10px هستند
  • پدیده‌های داخل‌کلیه راست و چپ 5px هستند
  • پدیده‌های داخل‌کلیه پایین 15px هستند

مثال 3

padding:10px 5px;
  • پدیده‌های داخل‌کلیه بالا و پایین 10px هستند
  • پدیده‌های داخل‌کلیه راست و چپ 5px هستند

مثال 4

padding:10px;
  • تمام 4 پدیده‌های داخل‌کلیه 10px هستند

لطفاً به اینجا نیز مراجعه کنید:

دستورالعمل CSS:مargins داخلی CSS

دستورالعمل HTML DOM:ویژگی padding

مثال

4 پدیده‌های داخل‌کلیه عنصر p تنظیم می‌شوند:

p
  {
  padding:2cm 4cm 3cm 4cm;
  }

تست کنید

قانون CSS

padding: length|initial|inherit;

مقدار ویژگی

مقدار توضیح
auto پدیده‌های داخل‌کلیه توسط مرورگر محاسبه می‌شوند.
length تعیین می‌کند که مقدار پدیده‌های داخل‌کلیه با واحد مشخصی است، مانند پیکسل، سانتی‌متر و غیره. مقدار پیش‌فرض 0px است.
% تعیین می‌کند که پدیده‌های داخل‌کلیه بر اساس درصد عرض عنصر والد تنظیم شوند.
inherit تعیین می‌کند که باید پدیده‌های داخل‌کلیه از عنصر والد ارث‌بخش شوند.

جزئیات فنی

مقدار پیش‌فرض: 0
میراث‌پذیری: خیر
نسخه: CSS1
قانون‌های JavaScript: اجسام.style.padding="10px 5px"

مثال عملی TIY

تمام پدیده‌های داخل‌کلیه در یک توضیح
این مثال نمایش می‌دهد که چگونه می‌توان تمام پدیده‌های داخل‌کلیه را در یک توضیح تنظیم کرد، که می‌تواند یک تا چهار مقدار داشته باشد.

پشتیبانی مرورگر

اعداد در جدول نشان‌دهنده نسخه اولین مرورگر هستند که از این ویژگی پشتیبانی می‌کند.

Chrome IE / Edge Firefox Safari Opera
1.0 4.0 1.0 1.0 3.5