CSS Pagination
ترقيم الصفحات بلغة CSS
سوف تتعلم في هذا الدرس عمل أزرار ترقيم الصفحات للتنقل داخل صفحة الويب لصفحات أخري إذا كانت الصفحة الحالية تعرض جزء من البيانات وباقي البيانات موزع علي صفحات أخري بلغة CSS.
التاريخ
الدروس
المستوى
اللغة
المشاهدات
المواضيع
CSS Pagination
ترقيم الصفحات بلغة CSS
</>
CSS Pagination
ترقيم الصفحات بلغة CSS
</>
CSS create pagination
إنشاء تعدد الصفحات في لغة CSS
يتم عمل ترقيم الصفحات بلغة CSS عن طريق عنصر <a> ثم إضافة له بعض التأثيرات مثل اللون والحجم والإطار وإضافة سهمين سهم أخر صفحة وسهم أول صفحة.
CSS create pagination
.pagination a { color: black; float: left; padding: 10px 20px; text-decoration: none; }
</>
CSS active current page
تفعيل الصفحة الحالية بلون مختلف في لغة CSS
إضافة كلاس active بلون مختلف لتمييز الصفحة الحالية في ترقيم الصفحات وتغيير اللون والخلفية في لغة CSS.
CSS active current page
إضافة كلاس active لتمييز الصفحة الحالية بلون مختلف في لغة CSS.
.active { background-color:#007bff; color:white !important; }
</>
CSS bordered pagination
عمل ترقيم الصفحات بإطارات في لغة CSS
CSS bordered pagination
عمل ترقيم الصفحات بإطارات في لغة CSS.
.pagination a { color: black; float: left; padding: 10px 20px; text-decoration: none; border:black solid 1px; }
</>
CSS Centered Pagination
توسيط ترقيم الصفحات في لغة CSS
توسيط ترقيم الصفحات في غلة CSS عن طريق إضافة pagination داخل div ثم إضافة خاصية text-align:center لأن pagination لا يمكن توسيطها لأن لها float:left.
CSS Centered Pagination
توسيط ترقيم الصفحات في لغة CSS.
.center { text-align: center; }
</>
CSS Breadcrumbs
تنقل للصفحات المتفرعة في لغة CSS
عمل شريط تنقل صفحات متفرعة من صفحات أخري في لغة CSS.
CSS Breadcrumbs
ul.breadcrumb { padding: 8px 16px; list-style: none; background-color: #eee; }