cssbit 2.0

<!-- #start pagination -->
<ul>
  <li>1</li>
  <li>2</li>
  <li>3</li>
</ul>
<!-- /end -->

#main ul {
   border: 0px solid #ddd;
   list-style: none;
   padding: .5em;
}
 
#main ul li {
   display: inline;
   padding: 0em
}

<ul>
  <li class="active"><a href="#">1</a></li>
  <li><a href="#">2</a></li>
  <li><a href="#">3</a></li>
  <li><a href="#">4</a></li>
  <li><a href="#">..</a></li>
</ul>

#main ul li a {
  border: 1px solid #ddd;
  padding: .1em .4em;
  text-decoration: none;
  background: #eee;
  color:#333
}
 
#main ul li a:hover {
  border: 1px solid #4DADDA;
  padding: .1em .4em;
  text-decoration: none;
  background: #C0E2F2;
  color:#217398
}
 
#main ul li.active a {
  border: 1px solid #ddd;
  padding: .1em .4em;
  text-decoration: none;
  background: #fff;
  color:#000;
  cursor: default; /* active page */
}

1. عبدالرحمن:
   

   رائع يا أستاذ نعيم،

   سأطبقه في أقرب وقت،

   ومبروك الستايل الجديد للمدونة.. : )

2. عمر الدليمي:
   

   رائع :) .. جميل جداً ..

   وجميل التصميم الجديد للمدونة :)

3. cssbit:
   

   عبد الرحمن
   العفو، شكرا

   عمر الدليمي
   شكرا لك

   التصميم هو نفسه Default الذي يأتي مع wordpress، فقط أضفت التعديلات على ملف style.css مع بعض الإيقونات وصورة الهدير

4. مبتدئ:
   

   رائع الدرس

   متابع بكل شوق كل الجديد المطروح في هذه المدونة الرائعة

   لك الشكرا و جعله الله في ميزان الحسنات

5. محمد:
   

   hggggggggggggg

6. cssbit:
   

   مبتدئ
   العفو عزيزي، اتمنى لك الاستفادة وتحت امرك اذا كان هناك شيء غير مفهوم

   محمد
   الله يستر ؟!!!

7. محمد:
   

   @cssbit,
   في بعض الاحيان يخرج الأمر عن السيطرة :)

   تستحق كل ثناء على درسك المفيد هذا، طبعا هذا لا يخفى على مطور مثلك،

   في المرة القادمة سيكون الرد مفيدا ;)

8. عبد الهادي:
   

   السلام عليكم ورحمة الله وبركاته..
   شكرا لك أخي نعيم على هذه الإضافة الرئعة بحق..
   تمت مشاركتها لقيمتها..
   موفق ومني لك أرق تحية..

9. عادل:
   

   مبروك القالب الجديد وشكرا على الدروس المفيدة

10. cssbit:
    

    العفو أخ عبد الهادي
    مرحبا بك

    شكرا اخي عادل ..

11. نبيل:
    

    مثال جميل وبسيط ومفيد

أضف تعليقاً