يعلمك هذا المقال كيفية تنزيل ملفات Bootstrap على جهاز الكمبيوتر الخاص بك ، وربطها بنصوص HTML الخاصة بك لاستخدام عناصر Bootstrap في التعليمات البرمجية الخاصة بك. بمجرد تنزيل ملفات Bootstrap وربطها ، يمكنك البدء في استخدام جميع عناصر ورقة الأنماط وعناصر JavaScript في Bootstrap في تصميم الويب الخاص بك.
خطوات
الخطوة الأولى: افتح موقع Bootstrap الإلكتروني في متصفح الإنترنت الخاص بك
اكتب https://getbootstrap.com في شريط العناوين واضغط ↵ Enter أو ⏎ Return على لوحة المفاتيح.
الخطوة 2. انقر فوق الزر "تنزيل"
سيؤدي هذا إلى فتح صفحة "التنزيل".
الخطوة الثالثة. انقر فوق الزر "تنزيل" أدناه "Compiled CSS and JS
" سيؤدي هذا إلى تنزيل ملفات Bootstrap الكاملة على جهاز الكمبيوتر الخاص بك كأرشيف ZIP.
إذا تمت مطالبتك ، فحدد موقع الحفظ لـ Bootstrap ZIP
الخطوة 4. استخراج الملفات من أرشيف ZIP
ابحث عن ملف ZIP الذي قمت بتنزيله للتو ، وانقر فوقه نقرًا مزدوجًا لاستخراج جميع الملفات الموجودة فيه إلى نفس المجلد.
- سيؤدي هذا إلى استخراج مجلدين باسم " المغلق" و " شبيبة."
- إذا كان تطبيق unzipper الخاص بك لا يستخرج الملفات تلقائيًا ، فراجع هذه المقالة لمعرفة جميع الطرق التي يمكنك من خلالها تصدير أرشيف ZIP.
الخطوة 5. انقل المجلدات المستخرجة إلى نفس المجلد مثل ملفات HTML الخاصة بموقعك على الويب
افتح المجلد الذي يحتوي على جميع ملفات HTML لموقعك على الويب ، واسحب " المغلق" و " شبيبة"هنا لنقلها إلى نفس المجلد مثل مستندات موقع الويب الخاص بك.
يمكنك الآن ربط الملفات بملفات HTML الخاصة بك ، والبدء في استخدام Bootstrap في التعليمات البرمجية الخاصة بك
الخطوة 6. انقر بزر الماوس الأيمن فوق ملف HTML الذي تريد استخدامه مع Bootstrap
يمكنك استخدام Bootstrap في ملف واحد فقط من ملفات HTML أو جميعها.
الخطوة 7. قم بالمرور فوق فتح باستخدام في قائمة النقر بزر الماوس الأيمن
ستظهر قائمة فرعية مع التطبيقات المتوافقة.
الخطوة 8. حدد برنامج محرر النصوص الخاص بك
سيؤدي هذا إلى فتح ملف HTML المحدد في محرر النصوص الخاص بك.
يمكنك استخدام محرر نصوص بسيط مثل المفكرة أو تحرير النص بالإضافة إلى محرر كود مخصص مثل ذرة (https://atom.io) أو كودا (https://panic.com/coda).
الخطوة 9. قم بإضافة روابط Bootstrap إلى رأس ملف HTML الخاص بك
قبل استخدام كود Bootstrap في HTML الخاص بك ، يجب عليك كتابة أو لصق الأسطر أدناه في رأس التعليمات البرمجية الخاصة بك:
إذا كنت تريد ربط واستخدام بعض الملفات الأخرى من مجلدي css و js ، فما عليك سوى إضافة أسطر جديدة في الرأس ، واستبدال أجزاء css / bootstrap.css و js / bootstrap.js بأسماء الملفات التي تريدها لربط
الخطوة 10. تحقق من موضع روابط Bootstrap في الكود
في رأس HTML ، يجب وضع كلا السطرين بين السطور والخط.
- بمجرد إضافة هذه الأسطر إلى الرأس ، يمكنك البدء في استخدام عناصر Bootstrap في ملف HTML هذا.
- يمكنك العثور على قائمة كاملة بجميع عناصر Bootstrap على https://getbootstrap.com/docs/4.3/getting-started/introduction. فقط انقر فوق أي فئة مثل تخطيط أو عناصر في القائمة اليسرى.
- بمجرد تثبيت Bootstrap ، يمكنك إدراج أو نسخ / لصق أي جزء من التعليمات البرمجية من هنا إلى التعليمات البرمجية الخاصة بك.
