css - 画像の角を丸くする

Question

jQuery プラグインを使用して の丸い角を作成して<li>いましたが、多くのブラウザーでは機能せず、マウス オーバーもサポートされていませんでした。

を使用して、2 つの画像 (左隅と右隅) を左右として使用する最良の方法は何だろうと思っています<li>。

Answer 1

そのために最もよく使用されているのは、リンク内のスパンです。

次のようなもの：

<li><a><span>Your text here</span></a></li>    

次に、リンクのホバー状態を使用して、スパンとリンクをターゲットにすることができます。

a:hover{some rules here}  
a:hover span{some more rules here} 

それは一種のセマンティックを維持し、ページに多くのジャンクを追加しません.

Answer 2

次のように、li の中に Div を配置できます。

<li>
  <div class="lefcorner"></div>
  <div class='liContent'>Foo</div>
  <div class='rightcorner'></div>
</li>

そうすれば、セマンティクスを維持し、スタイリング DIV のクロスブラウザー サポートも利用できます。