التحديد النسبي لـ CSS

سيتم تحريك صندوق العنصر إلى مسافة معينة عند تحديد المواضع النسبي. العنصر سيظل يحتفظ بنمطه قبل التحديد، وسيظل المساحة التي كان يسيطر عليها.

التحديد النسبي لـ CSS

التحديد النسبي هو مفهوم سهل الاستيعاب. إذا تم تحديد موضع نسبي للعنصر، فإنه سيظهر في الموضع الذي يوجد فيه. ثم يمكن تحريك هذا العنصر عبر تعيين المواضع العمودي أو الأفقي.

إذا تم تعيين top إلى 20px، فإن الصندوق سيكون في 20 بكسل تحت العنصر الأصلي. إذا تم تعيين left إلى 30 بكسل، فإنه سيتم إنشاء مساحة 30 بكسل على الجانب الأيسر من العنصر، مما يؤدي إلى تحريك العنصر إلى اليمين.

#box_relative {
  position: relative;
  left: 30px;
  top: 20px;
}

كما هو موضح في الشكل التالي:

مثال للتحديد النسبي لـ CSS

لاحظ أن العنصر لا يزال يشغل نفس المساحة سواء تم تحريكه أم لا عند استخدام التحديد النسبي. لذلك، يمكن أن يغطي تحريك العنصر العناصر الأخرى.

مثال للتحديد النسبي لـ CSS

تحديد المواقع: تحديد موضع نسبي
هذا المثال يوضح كيفية تحديد المواقع بشكل نسبي بالنسبة لموضع العنصر الطبيعي.