البرنامج التعليمي Bootstrap 3

BS HOME ابدأ BS BS Grid Basic بكالوريوس الطباعة جداول BS صور بكالوريوس BS Jumbotron بي إس ويلز تنبيهات BS أزرار BS مجموعات زر BS BS Glyphicons شارات / ملصقات BS أشرطة التقدم BS ترقيم الصفحات BS بكالوريوس بيجر مجموعات قائمة BS لوحات BS القوائم المنسدلة BS انهيار BS علامات التبويب / حبوب BS Navbar نماذج بكالوريوس مدخلات BS مدخلات BS 2 تحجيم المدخلات BS كائنات BS Media BS كاروسيل مشروط BS تلميح BS Tooltip BS Popover BS Scrollspy BS اللصقة مرشحات BS

شبكات التمهيد

نظام BS Grid BS مكدس / أفقي BS Grid Small BS شبكة متوسطة BS شبكة كبيرة أمثلة على شبكة BS

ثيمات Bootstrap

قوالب بكالوريوس موضوع BS "ببساطة أنا" موضوع BS "شركة" موضوع BS "الفرقة"

أمثلة التمهيد

أمثلة بكالوريوس اختبار BS تمارين البكالوريوس شهادة بكالوريوس

Bootstrap CSS المرجع

CSS جميع الفئات طباعة CSS أزرار CSS نماذج CSS مساعدي CSS صور CSS جداول CSS القوائم المنسدلة CSS ملاحق CSS الحروف الرسومية

Bootstrap JS المرجع

شبيبة الملحقة تنبيه JS زر JS JS Carousel طي JS JS المنسدلة شبيبة مشروط شبيبة بوبوفر شبيبة Scrollspy علامة التبويب JS JS Tooltip


مرجع طباعة Bootstrap CSS


إعدادات Bootstrap الافتراضية

حجم الخط الافتراضي العام لـ Bootstrap هو 14 بكسل ، مع ارتفاع خط يبلغ 1.428.

يتم تطبيق هذا على <النص الأساسي> وجميع الفقرات.

بالإضافة إلى ذلك ، تحتوي جميع عناصر <p> على هامش سفلي يساوي نصف ارتفاع خطها المحسوب (10 بكسل افتراضيًا).


الطباعة

العناصر أدناه هي عناصر HTML سيتم تصميمها بشكل مختلف قليلاً بواسطة Bootstrap عن الإعدادات الافتراضية للمتصفح. انظر إلى أمثلة "جربها" لمعرفة النتائج / الاختلافات.

يتم استخدام الفئات أدناه لتصميم العناصر بشكل أكبر.

Element/Class Description Example
<h1> - <h6>
or
.h1 - .h6
h1 - h6 headings
<small> Creates a lighter, secondary text in any heading

Heading (secondary text)

.small Indicates smaller text (set to 85% of the size of the parent): Smaller text
.lead Makes a text stand out: Stand out text
<mark>
or
.mark
Highlights text: Highlighted text
<del> Indicates deleted text: Deleted text
<s> Indicates no longer relevant text: No longer relevant text
<ins> Indicates inserted text: Inserted text
<u> Indicates underlined text: Underlined text
<strong> Indicates bold text: Bold text
<em> Indicates italic text: Italic text
.text-left Indicates left-aligned text
.text-center Indicates center-aligned text
.text-right Indicates right-aligned text
.text-justify Indicates justified text
.text-nowrap Indicates no wrap text
.text-lowercase Indicates lowercased text: LOWERCASED TEXT
.text-uppercase Indicates uppercased text: uppercased text
.text-capitalize Indicates capitalized text: capitalized text
<abbr> The <abbr> element indicates an abbreviation or acronym. Abbreviations with a title attribute have a dotted bottom border and a help cursor on hover, providing additional context on hover.
.initialism Displays the text inside the <abbr> element in a slightly smaller font size
<address> Presents contact information
<blockquote> Indicates blocks of content from another source
.blockquote-reverse Indicates a blockquote with right-aligned content
<ul> Indicates an unordered list
<ol> Indicates an ordered list
.list-unstyled Removes the default list-style and left margin on list items (works on both <ul> and <ol>). This class only applies to immediate children list items (to remove the default list-style from any nested lists, apply this class to any nested lists as well)
.list-inline Places all list items on a single line
<dl> Indicates a description list
.dl-horizontal Lines up the terms and descriptions in the <dl> element side-by-side. Starts off like default <dl>s, but when the browser window expands, it will line up side-by-side

رمز

Element/Class Description Example
<var> Indicates variables: x = ab + y
<kbd> Indicates input that is typically entered via the keyboard: CTRL + P
<pre> Indicates multiple lines of code
<pre class="pre-scrollable"> Indicates multiple lines of code with scrollbar
<samp> Indicates sample output from a computer program: Sample output
<code> Indicates inline snippets of code: span, div