التخلص من لى البند الأخير العداد

Question

لدي مشكلة مزعجة ..أريد أول 4 بنود في قائمة مرقمة ولكن أريد أن أترك البند الخامس من الترقيم ..هنا هو بلدي css :

#alternate_navigation ol
{
    display:block;
    padding:0;
    margin:0;
    counter-reset: item;
}

#alternate_navigation li
{
    display:block;
    padding:0px 0px 0px 10px; 
    margin:0;
    background: url('images/list_bg.jpg') no-repeat;
    height:19px;
    width:99%;
    border-bottom:1px solid #B9B5B2;
}

#alternate_navigation li:before 
{ 
  content: counter(item) ". "; 
  counter-increment: item ;
}

النتيجة :

1. الحجز عبر الانترنت على
2. قسيمة طلب
3. طباعة الحروف
4. إرسال رسائل البريد الإلكتروني
5. عرض الطلبات

كيف يمكنني تحقيق الماضي البند لا تكون مرقمة مثل هذا :

1. الحجز عبر الانترنت على
2. قسيمة طلب
3. طباعة الحروف
4. إرسال رسائل البريد الإلكتروني
   عرض الطلبات

ونعم HTML

<div id="alternate_navigation">
                   <ol>
                   <li><a href="#">Online Booking</a></li>
                   <li><a href="#">Coupon Ordering</a></li>
                   <li><a href="#">Print Letters</a></li>
                   <li><a href="#">Send Emails</a></li>
                   <li><a href="#">View orders</a></li>
                   </ol>
                   <div>

شكرا لك على أي رد

Answer 1

بعد الحالية الخاصة بك CSS ، إضافة:

#alternate_navigation li:last-child:before {
    content: "";
    counter-increment: none;
}

أنه يجب "إعادة تعيين" نمط العنصر الأخير.

تحرير: يجب فقط أن أذكر أن هذا لن ينجح في IE8 بسبب استخدام :الماضي-الطفل.إذا كنت بحاجة إلى IE6/7/8 التوافق, وأود أن استخدام شيء مثل مسج بدلا من يدويا إدخال علامات HTML.

Answer 2

هل من الممكن أن المستعرض الذي تستخدمه لا يدعم content, counter-reset, :before, أو counter-increment?

أنا متأكد أي لا ولست معينة عن الآخرين.إذا كان هذا هو الحال, أنت فقط استلام الافتراضي قائمة مرقمة:وباختصار ، فإن المتصفح سوف تتجاهل أحدث CSS.

Answer 3

يمكنك aplly فئة css إلى إعادة تعيين العداد مثل هذا المثال :

#alternate_navigation li.last:before
{ 
  content: ""; 
  counter-increment: none ;
}

تحقق من بلدي على سبيل المثال :

http://www.aeon-dev.org/tests/before_pseudo_ie.html

Answer 4

من حب الاستطلاع ، في هذه الحالة لماذا تستخدم العداد-إعادة تعيين في كل شيء ؟ لماذا لم يتم تعيين

list-style: decimal;

ثم html إضافة فئة إلى آخر <li> الوسم مثل <li class="last">?

ثم يمكنك تعيين

li.last { list-style: none; }