• 0

كيف أنشئ صفحة ويب باستخدام Bootstrap؟

هل يمكن مساعدتي بإنشاء صفحة ويب باستخدام Bootstrap  ما هي الخطوات الأساسية ومن أين أبدأ؟

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
  • 0

يوجد ثلاث خطوات أساسية للبدء بالعمل على إطار Bootstrap:

1- إضافة HTML5 doctype:

يستخدم Bootstrap  عناصر HTML5 وخصائص CSS التي تتطلب HTML5 doctype لذا يجب عليك تضمينها في بداية الصفحة مع تحديد السمة lang كما في المثال التالي:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8"> 
  </head>
</html>

2- تحديد الوسم <meta>:

لقد تم تصميم Bootstrap لجعل الصفحات تلائم شاشات الأجهزة المحمولة لذا عليك إضافة الوسم <meta> داخل الوسم <head>  لضمان التصيير rendering وخاصية التكبير باللمس touch zooming:

<meta name="viewport" content="width=device-width, initial-scale=1">
  • تُحدد القيمة width=device-width عرض صفحة الويب لتلائم عرض شاشة الجهاز (والتي سوف تختلف بحسب نوع الجهاز).
  • تُحدد الخاصيّة initial-scale=1 مستوى التكبير الأولي عند تحميل الصفحة لأول مرة من قبل المتصفح.

3- الحاويات Containers:

يتطلب عنصر Bootstrap حاوية لمحتوى الموقع يوجد نوعين من الحاوية في Bootstrap يمكنك الاختيار منها:

  1. container class. توفّر عرض ثابت ومستجيب.
  2.  container-fluid class. توفر عرض حاوية كامل ومتغير يمتد على كامل عرض المعاينة viewport.

ملاحظة: الحاوية في Bootstrap لا تقبل التضمين أي أنك لا تستطيع إضافة حاوية ضمن حاوية أخرى.

 

كيف أنشئ صفحة ويب باستخدام Bootstrap؟

تمّ تعديل بواسطة Lujain

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة

يجب أن تكون عضوًا لدينا لتتمكّن من التعليق

انشاء حساب جديد

يستغرق التسجيل بضع ثوان فقط


سجّل حسابًا جديدًا

تسجيل الدخول

تملك حسابا مسجّلا بالفعل؟


سجّل دخولك الآن