مثال
وضع بنود مرونة <div> العنصر مع مساحة بين السطور:
// Code for Safari 7.0+
document.getElementById("main").style.WebkitAlignContent = "space-between";
// Standard syntax
document.getElementById("main").style.alignContent
= "space-between"; انها محاولة لنفسك » تعريف والاستخدام
الخاصية alignContent محاذاة العناصر الحاوية مرنة عندما البنود لا تستخدم كل المساحة المتوفرة على عبر محور (vertically) .
نصيحة: استخدم خاصية justifyContent لمحاذاة العناصر على المحور الرئيسي (horizontally) .
ملاحظة: يجب أن يكون هناك عدة أسطر من البنود لهذا العقار أن يكون له أي تأثير.
دعم المتصفح
الأرقام في الجدول تحدد أول نسخة متصفح يدعم بشكل كامل العقار.
أرقام تليها بكت تحدد النسخة الأولى التي عملت مع بادئة.
| خاصية | |||||
|---|---|---|---|---|---|
| alignContent | 21.0 | 11.0 | 28.0 | 7.0 بكت | 12.1 |
ملاحظة: سفاري دعم بديل، الخاصية WebkitAlignContent.
بناء الجملة
إعادة الممتلكات alignContent:
object .style.alignContentتعيين الخاصية alignContent:
object .style.alignContent="stretch|center|flex-start|flex-end|space-between|space-around|initial|inherit"
قيم الممتلكات
| القيمة | وصف |
|---|---|
| stretch | القيمة الافتراضية. وامتدت البنود لتتناسب مع حاوية |
| center | يتم وضع البنود في وسط الحاوية |
| flex-start | يتم وضع العناصر في بداية الحاوية |
| flex-end | يتم وضع العناصر في نهاية الحاوية |
| space-between | يتم وضع العناصر مع مساحة بين السطور |
| space-around | يتم وضع العناصر مع مسافة قبل، بين، وبعد خطوط |
| initial | تحدد هذه الخاصية إلى قيمته الافتراضية. قرأت عن الأولي |
| inherit | يرث هذه الخاصية من عنصر الأم. قراءة حول وراثة |
تفاصيل تقنية
| القيمة الافتراضية: | تمتد |
|---|---|
| قيمة الإرجاع: | A سلسلة تمثل خاصية محاذاة المحتوى عنصر |
| صفحة CSS | CSS3 |
صفحات ذات صلة
CSS المرجع align-content property
HTML DOM STYLE المرجعي: alignItems property
HTML DOM STYLE المرجعي: alignSelf property
HTML DOM STYLE المرجعي: justifyContent property
<كائن نمط