كيفية إدارة التباعد والحشو في التصاميم سريعة الاستجابة

سيوضح هذا الدليل العملي طريقة إدارة المسافات والحشو في التصميمات سريعة الاستجابة.

كيفية إدارة التباعد والحشو في التصاميم المستجيبة؟

يمكن إدارة المساحة المتروكة والمسافات في التصميمات سريعة الاستجابة باستخدام CSS. ويرد أدناه عرض عملي لإدارة التباعد والحشو.

الخطوة 1: إنشاء بنية HTML

أولاً، قم بإنشاء بنية HTML وبعض النص بداخلها باستخدام

و <ديف> العلامات:

< جسم >
< h2 > الحشو والتباعد المستجيب لـ CSS < / h2 >
< شعبة > يحتوي عنصر CSS هذا على حشوة تبلغ 80 بكسل ومسافة 40 بكسل. < / شعبة >
< / جسم >

الخطوة 2: تطبيق CSS

---

---

الآن، دعونا نطبق CSS على <ديف> بطاقة شعار. أولاً قم بتعيين ' حشوة 'قيمة العقار إلى' 80 بكسل 'لتوفير المساحة حول العنصر. بعد ذلك، قم بتعيين ' هامِش 'قيمة العقار إلى' 40 بكسل 'وإنشاء مساحة حول العناصر الموجودة خارج الحدود. وأخيرًا، استخدم ' حدود ' الخاصية وحدد الحدود واللون لإنشاء الحدود:

شعبة {
حشوة : 80 بكسل ;
هامِش : 40 بكسل ;
حدود : 1 بكسل صلب أخضر ;
}

يؤكد الإخراج أعلاه أنه تم تطبيق التباعد والحشو.

دعونا نتحقق مما إذا كان مستجيبًا أم لا من خلال الضغط على نافذة المتصفح:

من خلال تقليص النافذة، يكون المحتوى قد تصرف بشكل مستجيب، مما يؤكد أن الحشو والتباعد المطبق مستجيب.

خاتمة

لإدارة المسافات والحشو في التصاميم سريعة الاستجابة، توجد خصائص CSS. لإضافة حشوة في التصميم سريع الاستجابة باستخدام ' حشوة ' ملكية. وبالمثل، يمكن إضافة المسافات في التصميم سريع الاستجابة باستخدام ' هامِش ' ملكية. قدمت هذه المقالة للمستخدمين حلاً لإدارة المسافات والحشو في التصميمات سريعة الاستجابة.