كيف يمكنك العمل حول IE لا يدعم :بعد ؟

Question

لقد حصلت على مجموعة من القوائم

<ul>
  <li class="first">Item 1</li>
  <li>Item 2</li>
  <li class="last">Item 3</li>
</ul>

على غرار مع

li:after {
  content: ' / ';
}
li.last:after {
  content: '';
}

هذا قد يكون نوعا من مشكلة شائعة.أنا أفكر في أن إما فوضى html ووضعها في الوسيط <li>الصورة التي تحتوي على حرف ، أو أن هوك على جافا سكريبت لوضعها في هناك إذا أي هو تحميل متصفح, ولكن هذا لن القبض على الناس بدون جافا سكريبت.Iuno.أنا أميل نحو التبعثر html ولكن أود أن أسمع إذا كان هناك بعض الآراء في هذا الصدد.

Answer 1

1. استخدام IE7.js هاك إضافة بعد pseudoelement الدعم.
2. استخدام التعليقات المشروطة إضافة إلى العلامات لمحاكاة هذا التأثير أو إزالة بعض من النمط الموجود لتسهيل قراءة دون فواصل -- على سبيل المثال ، السماح قائمة البنود المكدس في الأنماط في المشروط التعليق
3. تسمح IE6 أن تتحلل برشاقة من خلال إعادة ترتيب النمط حتى هذا لا يحدث, حتى لو كان يبدو مختلفا في المتصفحات الأخرى.

Answer 2

Internet Explorer (IE) لا يدعم :بعد محدد, يجب علينا أن نستخدم بعض هاك بدلا من ذلك, على سبيل المثال هذا واحد:

li { scrollbar-face-color: expression(!this.isInserted==true ? this.isInserted=(this.innerHTML = '' + this.innerHTML + 'xkcd150') : ''); }

"xkcd150" - هذا واحد سوف تضاف بعد كل <li>.

لها تعبير ، والتي عادة ما تستخدم لاستبدال وإصلاح بعض أي البق.

لذلك ، كامل شفرة هو:

li { scrollbar-face-color: expression(!this.isInserted==true ? this.isInserted=(this.innerHTML = '' + this.innerHTML + ' / ') : ''); }

li.last {
scrollbar-face-color: expression(!this.isInserted==true ? this.isInserted=(this.innerHTML = '' + this.innerHTML + '') : ''); }

أول خطوط يضيف " / ", والثاني يستخدم لإضافة شيء.

كل قانون يجب أن تضاف إلى ملف css.

Answer 3

إليك فكرة لن يروق لكم. 8-) ضع / الرموز في كصور خلفية، في الحشو الأيمن من <li>s.

Answer 4

وأنا مجرد القيام بذلك في اللغة من جانب الخادم عند إنشاء HTML القائمة. أفترض أنه سيتم النظر "التبعثر HTML".

Answer 5

يمكنني استخدام جافا سكريبت و التعليقات المشروطة.أيباستخدام مسج.

 <!--[if IE 6]>
   <script type='text/javascript'>
     $(document).ready( function() {
      $('li').not('li.last').after('/');
     });
   </script>
 <![endif]-->

هو طبعا من الأفضل استخدام منفصلة ملف JS.
هذا أيضا لديه عيب عليك أن تكتب كل شيء مرتين منذ وضعه في CSS من أجل الخير المتصفحات و مرة أخرى في جافا سكريبت ل IE6.

Answer 6

وحاول استخدام شيء من هذا القبيل مسج.

و`$ (وظيفة () {

و$ ( 'لى') لا ( ': الماضي والطفل'). إلحاق ( '\' ')؛

و})؛ `

وانها لا فوضى حتى أتش تي أم أل. أيضا، لجعل هذا العمل فقط مع IE، حاول استخدام التوافق مسج.

Answer 7

إذا لم يتم intented المحتوى الخاص بك إلى تغيير في وقت التشغيل، يمكنك استخدام ما يلي:

.icon-glass {
  *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '');
}

وإذا كان المقصود المحتوى الخاص بك إلى تغيير في وقت التشغيل، يمكنك أن تفعل شيئا من هذا القبيل:

.icon-glass {
  *top:expression(0, this.innerHTML = '');
}

ومما يؤسف له، وهذا هو بطيئة للغاية. في حين أنه من المرجح أن العمل في IE6 مع انخفاض كبير في أدائك، ومن المرجح أن تعطل إذا كان لديك الكثير من الرموز على صفحتك IE7. لذلك أنا لا أوصي هذه التقنية الثانية إلا إذا كنت تستخدم فقط عدد قليل جدا من الرموز وتستطيع خفض الأداء.

Answer 8

وإذا IE ستدعم الماضي للطفل أنك لن تحتاج إلى القيام به الطبقة = "مشاركة": P

تم IE الدعم وستظل حماقة. جعلت IE 8 تحسينات هائلة،: بعد و: قبل العمل كما تتوقعون، IE 7 تدعمهم كذلك. استهداف مجرد هذين، لا سيما وأن مايكروسوفت دفع IE 8 من خلال تحديث ويندوز.