علامات التبويب التمهيد
وهذا الفصل شرح الميزات التي تدعمها علامة التبويب التمهيد. ترحيل (ترقيم الصفحات)، وقائمة غير مرتبة، وتعامل التمهيد مثل عناصر واجهة أخرى كما يعالج الترحيل.
ترحيل (ترقيم الصفحات)
يسرد الجدول التالي التمهيد توفير الدرجة معالجة الترحيل.
Class | 描述 | 示例代码 |
---|---|---|
.pagination | 添加该 class 来在页面上显示分页。 |
<ul class="pagination"> <li><a href="#">«</a></li> <li><a href="#">1</a></li> ....... </ul> |
.disabled, .active | 您可以自定义链接,通过使用.disabled来定义不可点击的链接,通过使用.active来指示当前的页面。 |
<ul class="pagination"> <li class="disabled"><a href="#">«</a></li> <li class="active"><a href="#">1<span class="sr-only">(current)</span></a></li> ....... </ul> |
.pagination-lg, .pagination-sm | 使用这些 class 来获取不同大小的项。 |
<ul class="pagination pagination-lg">...</ul> <ul class="pagination">...</ul> <ul class="pagination pagination-sm">...</ul> |
علامة التبويب الافتراضية
يوضح المثال التالي استخدام.pagination الجدول الطبقة ناقش:
أمثلة
محاولة »
وكانت النتائج على النحو التالي:
وضع الترحيل
المثال التالي يوضحالدرجة .disabled التي نوقشت أعلاه الجدول، واستخدام .active:
أمثلة
محاولة »
وكانت النتائج على النحو التالي:
حجم الصفحة
يوضح المثال التالي الجدول الطبقة ناقش.pagination- * الاستخدام:
أمثلة
محاولة »
وكانت النتائج على النحو التالي:
الوجه (بيجر)
إذا كنت ترغب في إنشاء وصلات صفحة بسيطة لتوفر للمستخدمين التنقل من خلال الصفحة لتحقيقه. وصلات الترحيل بوصفها قائمة غير مرتبة هي الوجه. افتراضيا، وتتركز الروابط. يسرد الجدول التالي التمهيد الطبقة معالجة الوجه.
Class | 描述 | 示例代码 |
---|---|---|
.pager | 添加该 class 来获得翻页链接。 |
<ul class="pager"> <li><a href="#">Previous</a></li> <li><a href="#">Next</a></li> </ul> |
.previous, .next | 使用 class.previous把链接向左对齐,使用.next把链接向右对齐。 |
<ul class="pager"> <li class="previous"><a href="#">← Older</a></li> <li class="next"><a href="#">Newer →</a></li> </ul> |
.disabled | 添加该 class 来获得一个颜色变淡的外观。 |
<ul class="pager"> <li class="previous disabled"><a href="#">← Older</a></li> <li class="next"><a href="#">Newer →</a></li> </ul> |
الصفحة الافتراضية
يوضح المثال التالي الجدول الطبقة تناقش استخدام.pager:
أمثلة
محاولة »
وكانت النتائج على النحو التالي:
الروابط الانحياز
يوضح المثال التالي .previousالدرجة التي نوقشت أعلاه الجدول، واستخدام .next:
أمثلة
محاولة »
وكانت النتائج على النحو التالي:
دولة الوجه
يوضح المثال التالي مناقشة جدول الدرجة استخدام.disabled:
أمثلة
محاولة »
وكانت النتائج على النحو التالي:
أمثلة أخرى من ترقيم الصفحات
فئة | وصف | أمثلة |
---|---|---|
.pager | ويربط ترقيم الصفحات بسيطة، تركزت الروابط. | محاولة |
.previous | .pager نمط الزر السابق، تركت له ما يبرره | محاولة |
.next | .pager على زر النمط التالي انقر بزر الماوس الأيمن الانحياز | محاولة |
.disabled | رابط تعطيل | محاولة |
.pagination | وصلات الترحيل | محاولة |
.pagination-جي | الروابط ترحيل أكبر | محاولة |
.pagination-SM | حجم أصغر من الروابط الترحيل | محاولة |
.disabled | رابط تعطيل | محاولة |
.active | وصول الحالي غرار ربط الصفحة | محاولة |