CSS padding کا اپریشن
- پیشین پیغام overscroll-behavior-y
- آئندہ صفحہ padding-block
تعریف و استفاده
ویژگی کوتاهنویسی 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:CSS داخلی فضاسازی
دستورالعمل مرورگر HTML DOM:ویژگی padding
نوشتار CSS
padding: length|initial|inherit;
مقدار ویژگی
| مقدار | توضیح |
|---|---|
| auto | مرورگر فضای داخلی را محاسبه میکند. |
| length | تعیین مقدار فضای داخلی به وسیله واحدهای مشخص، مانند پیکسل، سانتیمتر و غیره. مقدار پیشفرض 0px است. |
| % | تعیین میکند که فضای داخلی بر اساس درصد عرض عنصر والد است. |
| inherit | تعیین میکند که فضای داخلی باید از عنصر والد ارث بگیرد. |
جزئیات فنی
| مقدار پیشفرض: | 0 |
|---|---|
| ارث: | خیر |
| نسخه: | CSS1 |
| نوشتار جاوااسکریپت: | object.style.padding="10px 5px" |
مثال عملی
- تمام ویژگیهای فضای داخلی در یک توضیح
- این مثال نشان میدهد که چگونه میتوان تمام ویژگیهای فضای داخلی را در یک توضیح قرار داد، که میتواند یک تا چهار مقدار داشته باشد.
پشتیبانی مرورگر
اعداد شمار در جدول نشاندهنده نسخه اولین مرورگر هستند که این ویژگی را به طور کامل پشتیبانی میکند.
| Chrome | IE / Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| 1.0 | 4.0 | 1.0 | 1.0 | 3.5 |
- پیشین پیغام overscroll-behavior-y
- آئندہ صفحہ padding-block
