خصائص row-gap CSS
التعريف والاستخدام
خصائص row-gap تحدد الفجوة بين السطور في التخطيط المروني أو الشبكة.
خصائص row-gap كانت تسمى سابقاً grid-row-gap.
يرجى الرجوع إلى:
دليل CSSتخطيط شبكة CSS
دليل CSSتخطيط مروني CSS
دليل CSSخصائص gap
دليل CSSخصائص فجوة العمود
مثال
مثال 1
تحديد فجوة بين السطور في الشبكة 50 بكسل:
#grid-container { display: grid; row-gap: 50px; }
مثال 2: تخطيط مروني
عندما يتم تحديد مسافة السطور في التخطيط المروني إلى 70px:
#flex-container { display: flex; row-gap: 70px; }
الصيغة CSS
row-gap: length|normal|initial|inherit;
القيمة | الوصف |
---|---|
length | حدد طول المسافة بين السطور المحددة أو القيمة المئوية. |
normal | القيمة الافتراضية. يحدد المسافة بين السطور العادية. |
initial | ضع هذا الخصائص في قيمته الافتراضية. يرجى الرجوع إلى: initial. |
inherit | يرث هذا الخصائص من عنصر الأب. يرجى الرجوع إلى: inherit. |
تفاصيل التقنية
القيمة الافتراضية: | normal |
---|---|
التوريث: | لا |
إنتاج المتحرك: | يدعم. يرجى الرجوع إلى الخصائص المنفردة. يرجى الرجوع إلى:خصائص المتحرك. |
الإصدار: | مستوى 3 لمodule CSS Box Alignment |
جافا سكربت الصيغة: | object.style.rowGap="50px" |
دعم المتصفح
الرقم في الجدول يوضح إصدار المتصفح الأوائل الذي يدعم هذا الخصائص.
تخطيط | Chrome | IE / Edge | Firefox | Safari | Opera |
---|---|---|---|---|---|
في الشبكة | 66 | 16 | 61 | 12 | 53 |
في الحقل المروني | 84 | 84 | 63 | 14.1 | 70 |