يعدل أو يكيف
تعرف على كيفية تصميم وتخصيص وتوسيع Bootstrap مع Sass ، وحمل كبير من الخيارات العالمية ، ونظام ألوان موسع ، والمزيد.
ملخص
هناك عدة طرق لتخصيص Bootstrap. يمكن أن يعتمد أفضل مسار لك على مشروعك ، وتعقيد أدوات البناء ، وإصدار Bootstrap الذي تستخدمه ، ودعم المستعرض ، والمزيد.
طريقتنا المفضلة هي:
- استخدام Bootstrap عبر مدير الحزم حتى تتمكن من استخدام ملفات المصدر الخاصة بنا وتوسيعها.
- استخدام ملفات التوزيع المترجمة من Bootstrap أو jsDelivr حتى تتمكن من إضافة أو تجاوز أنماط Bootstrap.
بينما لا يمكننا الخوض في التفاصيل هنا حول كيفية استخدام كل مدير حزم ، يمكننا تقديم بعض الإرشادات حول استخدام Bootstrap مع مترجم Sass الخاص بك .
بالنسبة لأولئك الذين يرغبون في استخدام ملفات التوزيع ، راجع صفحة البدء لمعرفة كيفية تضمين هذه الملفات ومثال على صفحة HTML. من هناك ، استشر المستندات للتخطيط والمكونات والسلوكيات التي ترغب في استخدامها.
عندما تتعرف على Bootstrap ، استمر في استكشاف هذا القسم لمزيد من التفاصيل حول كيفية الاستفادة من خياراتنا العالمية ، والاستفادة من نظام الألوان لدينا وتغييره ، وكيف نبني مكوناتنا ، وكيفية استخدام قائمتنا المتزايدة من خصائص CSS المخصصة ، وكيف لتحسين التعليمات البرمجية الخاصة بك عند الإنشاء باستخدام Bootstrap.
CSPs و SVGs المدمجة
تشتمل العديد من مكونات Bootstrap على SVGs مضمنة في CSS لدينا لتصميم المكونات باستمرار وبسهولة عبر المتصفحات والأجهزة. بالنسبة للمؤسسات التي لديها تكوينات أكثر صرامة لـ CSP ، قمنا بتوثيق جميع مثيلات SVGs المضمنة الخاصة بنا (والتي يتم تطبيقها جميعها عبر background-image) حتى تتمكن من مراجعة خياراتك بشكل أكثر شمولاً.
- الأكورديون
- زر الإغلاق (المستخدم في التنبيهات والوسائط)
- مربعات اختيار النموذج وأزرار الاختيار
- مفاتيح الشكل
- رموز التحقق من صحة النموذج
- حدد القوائم
- ضوابط دائري
- أزرار تبديل Navbar
بناءً على محادثة المجتمع ، تتضمن بعض الخيارات لمعالجة هذا الأمر في قاعدة التعليمات البرمجية الخاصة بك استبدال عناوين URL بأصول مستضافة محليًا ، وإزالة الصور واستخدام الصور المضمنة (غير ممكن في جميع المكونات) ، وتعديل CSP الخاص بك. توصيتنا هي مراجعة سياسات الأمان الخاصة بك بعناية وتحديد أفضل مسار للمضي قدمًا ، إذا لزم الأمر.