2

私はたくさんのリストを持っています

<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>て文字を含む仲介者を配置するか、IE が読み込み中のブラウザーである場合は javascript をフックしてそこに配置することができると考えていますが、それは javascript なしで人々を捕まえることはできません。イウノ。私はhtmlを乱雑にする方向に傾いていますが、これについて意見があるかどうか聞きたいです.

4

8 に答える 8

2

ここにあなたが好きではない考えがあります。8-) s の右側のパディングに、背景画像として / 記号を入れます<li>。

于 2009-05-01T21:43:44.067 に答える
2
  1. IE7.jsハックを使用して、疑似要素サポートの後に追加します。
  2. 条件付きコメントを使用してマークアップに追加し、その効果をシミュレートするか、既存のスタイルの一部を削除して区切り線なしで読みやすくします。たとえば、条件付きコメントでリスト項目をスタイルシートに積み重ねます。
  3. スタイルを再配置することで IE6 が適切に劣化できるようにします。これにより、他のブラウザーでは異なって見える場合でも、これが発生しなくなります。
于 2009-05-01T21:50:38.807 に答える
1

リストの HTML を生成するときに、サーバー側の言語でそれを行うだけです。それは「HTMLを乱雑にする」と見なされると思います。

于 2009-05-01T21:43:13.910 に答える
0

jQueryなどを使ってみてください。

`$(関数(){

$('li').not(':last-child').append('\'');

});`

html が乱雑になることはありません。また、これを IE でのみ動作させるには、jquery 互換性を使用してみてください。

于 2009-05-02T16:53:19.887 に答える
0

JavaScript と条件付きコメントを使用します。つまり、jQuery を使用します。

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

別の JS ファイルを使用することをお勧めします。
これには、良いブラウザーの場合は CSS に、IE6 の場合は javascript にもう一度記述するため、すべてを 2 回書かなければならないという欠点もあります。

于 2009-05-02T08:06:51.493 に答える
0

コンテンツが実行時に変更されることを意図していない場合は、次を使用できます。

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

コンテンツが実行時に変更されることを意図している場合は、次のようにすることができます。

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

残念ながら、これは非常に遅いです。パフォーマンスが大幅に低下しても IE6 で動作する可能性がありますが、ページにアイコンが多すぎると IE7 がクラッシュする可能性があります。したがって、ごく少数のアイコンのみを使用し、パフォーマンスの低下を許容できる場合を除き、この 2 番目の手法はお勧めしません。

于 2014-03-25T22:40:42.300 に答える
-1

また、IE が last-child をサポートする場合は、class="last" :P を実行する必要はありません。

IE のサポートはこれまでも、これからもくだらないものです。IE 8 では大幅な改善が行われました。:after と :before は期待どおりに機能し、IE 7 ではそれらもサポートされています。特に Microsoft が Windows Update で IE 8 をプッシュしているため、これら 2 つをターゲットにしてください。

于 2009-05-01T21:57:10.697 に答える