0

wordpressでサイドメニューを作ろうとしていますが、うまくいっていますが、何らかの理由でcssが面倒で、頭を包むことができないようです。

ナビゲーションは次のようになります。

<nav>
  <ul id="sidebar-menu">
    <li class="page_item page-item-8 current_page_item"><a href="http://www.consana.nl/diensten/">Diensten</a></li>
    <li class="page_item page-item-32"><a href="http://www.consana.nl/diensten/dienst-1/">Dienst 1</a></li>
    <li class="page_item page-item-33"><a href="http://www.consana.nl/diensten/dienst-2/">Dienst 2</a></li>
    <li class="page_item page-item-36"><a href="http://www.consana.nl/diensten/dienst-3/">Dienst 3</a></li>
 </ul>
</nav>

このための css は次のようになります。

#left-side nav a:hover, #left-side nav .current_page_item{
   border-left:10px #b8d276 solid;
   border-right:none;
   padding-left:10px;
   font-style: italic;
}

アイテムの 1 つが「選択」されると (.current_page_item-tag を持つ)、ホバーが再び適用されます。

次のページで、実際の動作を確認できます: http://www.consana.nl/en/diensten/

どんな助けでも大歓迎です！

4

1 に答える 1

2

<li>デフォルトborder-leftがあり、アンカー要素をスタイリングしているためです。

#left-side nav li:hover, #left-side nav .current_page_item{
   border-left:10px #b8d276 solid;
   border-right:none;
   padding-left:10px;
   font-style: italic;
}
于 2013-03-02T12:14:00.860 に答える