كيفية تصميم ترقيم الصفحات في HTML و CSS

ستتعلم اليوم في هذه المدونة كيفية إنشاء تصميم رائع لترقيم الصفحات باستخدام HTML و CSS فقط

مرحبًا أيها القراء ، ستتعلم اليوم في هذه المدونة كيفية إنشاء تصميم رائع لترقيم الصفحات باستخدام HTML و CSS فقط.

في هذا البرنامج (Pagination Design) ، يوجد حاوية ترقيم صفحات بيضاء بها بعض النصوص ولون خلفية متدرج كما رأيته في الصورة. وفي الحاوية يوجد ترقيم صفحات مع الأزرار العشرة. عند النقر فوق الزر المعين ، يوجد تأثير Box-shadow للإشارة إلى النقر فوق الزر أم لا. هذا برنامج CSS خالص يعني أنه يتم استخدام HTML و CSS فقط لإنشاء ترقيم الصفحات هذا.

إذا كنت تشعر بصعوبة في فهم ما أقوله. يمكنك مشاهدة فيديو تعليمي كامل عن هذا البرنامج (Pagination Design).

كما شاهدت برنامج ترقيم الصفحات في الفيديو. أتمنى أن تكون قد فهمت الرموز وراء إنشاء هذا التصميم. كما تعلم ، لقد استخدمت HTML و CSS فقط لإنشاء هذا التصميم ، لذلك لا توجد أكواد واسعة في هذا البرنامج.

إذا كنت تحب هذا البرنامج (Pagination Design) وترغب في الحصول على أكواد المصدر. يمكنك بسهولة الحصول على الأكواد المصدرية لهذا البرنامج. للحصول على أكواد المصدر ، تحتاج فقط إلى التمرير لأسفل.
إذا كنت مبتدئًا وتعرف HTML و CSS ، فيمكنك أيضًا إنشاء هذا النوع من تصميم ترقيم الصفحات. ولكن إذا كنت تعرف JavaScript جيدًا ، فيمكنك أن تأخذ هذا التصميم إلى المستوى التالي.

تصميم ترقيم الصفحات في HTML CSS
لإنشاء هذا البرنامج (Pagination Design). أولاً ، تحتاج إلى تحميل ملف الاكواد من زر التحميل

الملفات

ما هو رد فعلك؟

like

dislike

love

funny

angry

sad

wow