التمهيد الملف الشخصي
ما هو التمهيد؟
التمهيد هو إطار الأمامية للالتطور السريع للتطبيقات الويب والمواقع على شبكة الإنترنت. ويستند التمهيد على HTML، CSS، وجافا سكريبت.
تاريخ
ألبس الحذاءمارك أوتوويعقوب ثورنتون تطويرالتغريد.التمهيد هو أغسطس 2011 نشرت يوم جيثب المنتجات مفتوحة المصدر.
لماذا التمهيد؟
- المحمول أولا: منذ التمهيد 3 فصاعدا، ويشمل الإطار المكتبات في جميع أنحاء أولوية الجهاز المحمول من النمط.
- دعم المتصفح: جميع المتصفحات الرئيسية تدعم التمهيد.
- سهلة الاستخدام: ما دام لديك معرفة أساسية من HTML و CSS، يمكنك أن تبدأ في تعلم التمهيد.
- التصميم المتجاوب: التمهيد استجابة CSS قادرة على سطح المكتب على التكيف، وأقراص والهواتف المحمولة.لمزيد من المعلومات حول التصميم المتجاوب، متاح التمهيد التصميم المتجاوب .
- ذلك للمطورين إنشاء واجهة بسيطة توفر حل موحد.
- ويشمل قوية المدمج في المكونات، وسهلة لتخصيص.
- كما يوفر التخصيص على شبكة الإنترنت.
- فهو مفتوح المصدر.
محتويات حزمة التمهيد
- البنية الأساسية: يوفر التمهيد الهيكل الأساسي للخلفية غرار ربط مع نظام الشبكة.وسيتم شرح ذلك بالتفصيلالتمهيد شاردة الأساسية.
- CSS: التمهيد يأتي مع الميزات التالية: ضبط العالمي CSS، وتحديد أنماط أساسية عنصر HTML، والطبقة قابلة للتطوير، ونظام الشبكة المتقدمة.وسيكون هذا القسم شرح بالتفصيلالتمهيد CSS.
- المكونات: التمهيد يحتوي على عشرات المكونات قابلة لإعادة الاستخدام لخلق صور، القوائم المنسدلة، والملاحة، مربع منبثق مربع التنبيه، وهلم جرا.وسيتم شرح ذلك بالتفصيلتخطيط الأجزاء المكونة.
- جافا سكريبت القطعة: التمهيد يحتوي على عشرات مخصصة مسج المساعد.ويمكن أن تشمل جميع المكونات الإضافية، يمكن أن تحتوي على هذه المكونات الإضافية أيضا بشكل فردي. وسيتم شرح ذلك في جزء التفاصيلالتمهيد المكونات.
- التخصيص: يمكنك تخصيص عناصر التمهيد، والمتغيرات أقل ومسج المكونات في الحصول على نسختك الخاصة.
أمثلة على الانترنت
التمهيد موقع تعليمي يحتوي على المئات من الأمثلة.
يمكنك استخدام موقعنا على الانترنت على الانترنت محرر كود محرر، وانقر على زر تشغيل لعرض النتائج.
أمثلة التمهيد
<div الطبقة = "حاوية">
<div الطبقة = "jumbotron">
<H1> بلدي أول صفحة التمهيد </ H1>
<P> إعادة تعيين حجم نافذة لعرض تأثير استجابة! </ P>
</ div>
<div الطبقة = "الصف">
<div الطبقة = "عمود-SM-4 ">
<H3> العمود 1 </ H3 >
<P> التعلم ليس التكنولوجيا فحسب، بل أيضا حلما! </ P>
<P> الأحلام مرة أخرى Niubi، ولكن أيضا تفسح المجال وتريد عصا مصاصة! </ P>
</ div>
<div الطبقة = "عمود-SM-4 ">
<H3> العمود 2 </ H3 >
<P> التعلم ليس التكنولوجيا فحسب، بل أيضا حلما! </ P>
<P> الأحلام مرة أخرى Niubi، ولكن أيضا تفسح المجال وتريد عصا مصاصة! </ P>
</ div>
<div الطبقة = "عمود-SM-4 ">
<H3> العمود 3 </ H3 >
<P> التعلم ليس التكنولوجيا فحسب، بل أيضا حلما! </ P>
<P> الأحلام مرة أخرى Niubi، ولكن أيضا تفسح المجال وتريد عصا مصاصة! </ P>
</ div>
</ div>
</ div>
محاولة »
مزيد من الأمثلة
التمهيد مثال 2
<div الطبقة = "الجدول استجابة">
<الجدول الطبقة = "الجدول مخطط الجدول الجدول -bordered">
<THEAD>
<tr>
<ث> # </ تشرين>
<ث> اسم </ تشرين>
<ث> شارع </ تشرين>
</ tr>
</ THEAD>
<TBODY>
<tr>
<td> 1 </ td>
<td> آنا رائع </ TD >
<td> بروم شارع </ TD >
</ tr>
<tr>
<td> 2 </ td>
<td> ديبي دالاس </ TD >
<td> هيوستن شارع </ TD >
</ tr>
<tr>
<td> 3 </ td>
<td> فلان الفلاني </ TD >
<td> ماديسون شارع </ TD >
</ tr>
</ TBODY>
</ الجدول>
</ div>
محاولة »
انقر على زر "حاول" لنرى كيف يعمل.