أفضل مكتبة أكواد css و js جاهزة (bootstrap)

سلام عليكم ورحمة الله وبركاته وبعد في إطار البرمجة تصاميم وكما يعرف أغلب مبرمجين و المصممين خاصة متخصصين في برمجيات ويب ما هو bootstrap ففي الحقيقة هو مشروع مفتوح المصدر بمعني أخر هو هو إطار العمل جاهز لإستخدام يتوفر على مكتبة مهم من أكواد css و js أطلقته شركة تويتر سنة 2011 وتكمل أهمية هده التقنية في توفير وقت و المجهود و تظمن نتائج مقنعة بتصميم جذاب حتى لو كان المبرمج لا يجيد إلا القليل من الـ html و الـ css.

طريقة تركيب bootstrap في مشروعي

طريقة سهلة جدآ كل ما عليك هو إضافة أسطر تالية داخل الوسم <head>

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">

ادا كنت تريد مكتبة جافا js ضف التالى فوق </body>

تصفح أيضا :CSS Background Patterns

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js" integrity="sha384-wHAiFfRlMFy6i5SRaxvfOCifBUQy1xHdJ/yoi7FRNXMRBu5WHdZYu1hA6ZOblgut" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js" integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous"></script>

مثال حول طريقة إضافة bootstrap

<!doctype html>
<html lang="en">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">

    <title>Hello, world!</title>
  </head>
  <body>
    <h1>Hello, world!</h1>

    <!-- Optional JavaScript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js" integrity="sha384-wHAiFfRlMFy6i5SRaxvfOCifBUQy1xHdJ/yoi7FRNXMRBu5WHdZYu1hA6ZOblgut" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js" integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous"></script>
  </body>
</html>

دورة مجانية bootstrap

فإذا كنت لا تجيد أو لا تعرف شيء عن هده التقنية فأنصحك بزيارة الموقع التالي

تصفح أيضا :تغيير شكل تعليقات أدمين في تعليقات بلوجر

مشاريع مفتوحة المصدر bootstrap

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

تصفح أيضا :إضافة تأثير على لوجو متل مدونة ماتريال ويب

تحميل مشاريع bootstrap مجانا

شراء مشاريع جاهزة bootstrap

انضم إلى Blum الآن!

هل تبحث عن منصة تداول سهلة وآمنة للعملات الرقمية؟ Blum هي خيارك المثالي! استمتع بتجربة تداول سلسة وابدأ في كسب المكافآت من خلال المشاركة في الألعاب والمهام داخل المنصة.

مزيد من المعلومات

لا تفوت الفرصة، انضم اليوم وابدأ في استكشاف عالم العملات الرقمية مع Blum!

انضم الآن

يمكنك شراء مشاريع جاهزة من الموقع الرسمي بأثمنة مناسبة في حالة ادا كانت لديك إمكانيات مالية بدهب إلى هده الصفحة

شراء مشاريع bootstrap

تصفح أيضا :إضافة التهنئة برمضان مبارك بلوجر

للمزيد من المعلومات يمكنك زيارة موقع الرسمي بإستخدام الزر التي

gobootstrap

تابعوا مدونتنا للمزيد من الشروحات وسلام عليكم

شارك Share Tweet Share Share Share

انقر هنا

محمد نجيري (mnajiri@) مشرف على مدونة ماتريال ويب تحت الرابط التالي :https://mdwab.blogspot.com/ مند 2018 و أدعوك لمتابعتي عبر حسابي على أنستغرام

8 تعليقات

يسعدنا تفاعلكم بالتعليق، لكن يرجى مراعاة الشروط التالية لضمان نشر التعليق

● أن يكون التعليق خاص بمحتوى التدوينة
● أن لا تضع أي روابط خارجية
● أي سؤال خارج محتوى التدوينة يرجى تواصل معنا
● يمكنك تعليق بإستخدام صور ✋👇

𝕸𝖔𝖍𝖆𝖒𝖊𝖉7 يناير 2019 في 2:34 ص

ردحذف
الردود
غير معرف7 يناير 2019 في 10:34 ص
test
ردحذف
الردود
ahmed mahmoud abdulsalam10 سبتمبر 2019 في 7:33 م
اااا
ردحذف
الردود
𝕸𝖔𝖍𝖆𝖒𝖊𝖉2 يوليو 2020 في 3:42 م
العفو 🌹🌹
ردحذف
الردود
طه اشرف3 فبراير 2021 في 1:34 ص
أرجوا وضع خاصية لوضع خلفية وحدود للعناوين الفرعية للمقال، مع زكر طريقة وضعها اذا سمحت
ردحذف
الردود

المثبت