خصائص الأسفل لـ CSS
- الصفحة السابقة border-width
- الصفحة التالية box-decoration-break
التعريف والاستخدام
تحدد خاصية bottom حافة الأسفل للعنصر. تعريفها يحدد التباين بين الحافة الخارجية للمساحة المMargins السفلية للعنصر وكامل العنصر السفلي.
ملاحظة:إذا كان قيمة الخاصية position هي "static"، فإن تعيين خاصية bottom لن ينتج أي تأثير.
الشرح
للعناصر الثابتة، تلقائي؛ للقيم الطولية، الطول المطلق الم相应؛ للقيم المئوية، القيمة المحددة؛ وإلا تلقائي.
للعناصر المحددة بشكل نسبي، إذا كانت bottom و top كلاهما تلقائي، فإن القيم المحسوبة لكلاهما ستكون 0؛ إذا كان واحدًا منهما تلقائيًا، فإن القيمة المحسوبة ستكون عكس القيمة الأخرى؛ إذا لم تكن كلاهما تلقائيًا، فإن bottom ستأخذ القيمة العكسية لتصحيح top.
انظر أيضًا:
دليل CSSتثبيت CSS
دليل HTML DOMخاصية bottom
مثال
ضبط حافة الأسفل للصورة على 5 بكسل فوق حافة الأسفل للعنصر المحتوي:
img
{
position:absolute;
bottom:5px;
}
جملة CSS
bottom: auto|طول|initial|inherit;
قيمة الخاصية
| القيمة | الوصف |
|---|---|
| تلقائي | القيمة الافتراضية. يتم حساب موقع القاع من قبل المتصفح. |
| % | تعيين موقع الحافة السفلية للعنصر بناءً على النسبة المئوية من حجم العنصر. يمكن استخدام القيم السلبية. |
| طول | استخدام وحدات مثل px،cm لتعيين موقع الحافة السفلية للعنصر. يمكن استخدام القيم السلبية. |
| توريث | يحدد أن يجب أن يتم توريث قيمة الخاصية bottom من العنصر الأب. |
تفاصيل التقنية
| القيمة الافتراضية: | تلقائي |
|---|---|
| التوريث: | لا |
| الإصدار: | CSS2 |
| جافا سكريبت الجملة: | object.style.bottom="50px" |
مزيد من الأمثلة
- استخدام قيمة البكسل لضبط حافة الأسفل للصورة
- هذا المثال يوضح كيفية استخدام قيمة البكسل لضبط حافة الأسفل للصورة.
- استخدام النسبة المئوية لضبط حافة الأسفل للصورة
- هذا المثال يوضح كيفية استخدام النسبة المئوية لضبط حافة الأسفل للصورة.
دعم المتصفح
الرقم في الجدول يوضح إصدار المتصفح الأول الذي يدعم هذه الخاصية بشكل كامل.
| Chrome | IE / Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| 1.0 | 5.0 | 1.0 | 1.0 | 6.0 |
- الصفحة السابقة border-width
- الصفحة التالية box-decoration-break
