2.7 KiB
| title | localeTitle |
|---|---|
| Get Started | البدء |
البدء
Bootstrap هو إطار مجاني ومفتوح المصدر تم تطويره بواسطة Twitter ، ويوفر مجموعة متنوعة من القوالب للاستخدام مع تطوير الواجهة الأمامية. يجعل استخدام Bootstrap من السهل تصميم موقع ويب متجاوب تمامًا وهو إطار يستحق التعلم.
ما هو موقع الويب المتجاوب
موقع الويب المتجاوب هو موقع ويب يقوم بتغيير حجم وإعادة ترتيب تلك العناصر على الصفحة بناءً على حجم متصفحك. باستخدام موقع ويب متجاوب إذا كنت تغير حجم متصفحك ، يمكنك مشاهدة التغييرات تحدث في الوقت الفعلي. Bootstrap يجعل موقعك يستجيب لك.
كيف أقوم بإضافة Bootstrap إلى صفحتي
تعد إضافة bootstrap إلى صفحتك عملية سريعة ، فما عليك سوى إضافة ما يلي إلى <head> العلامات في شفرتك.
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
سوف تحتاج أيضا إلى إضافة ما يلي بين body العلامات في التعليمات البرمجية. باستخدام Bootstrap ، ستستخدم علامات <div> عند استخدام العديد من ميزات Bootstrap ، وستحتوي كل علامة على مجموعة فريدة من الفئات المطبقة التي تسمح للعلامة بتنفيذ مهمتها. ستعرض الأقسام الأخرى من دليل Bootstrap هذا المزيد من الأمثلة عن كيفية استخدام Bootstrap <div> . (العلامات <div> ليست حصرية لـ Bootstrap ، ومع ذلك فإن Bootstrap تستفيد منها.). وفيما يلي التعليمات البرمجية التي سوف شأنه أن يضيف إلى body العلامات في التعليمات البرمجية لإنهاء بدء العمل. ضع في اعتبارك أنه أثناء إنشاء الحاوية ، ستظل الصفحة فارغة حتى تضيف محتوى إلى الحاوية.
<div class="alert alert-success" role="alert">
<strong>Congratulations!</strong>
<p>Bootstrap is now working on this page</p>
</div>
تهانينا!
يعمل Bootstrap الآن على هذه الصفحة