0

私はCSSとウェブサイトのデザインが初めてです。このページの左側にあるメニューを参照してください: メニュー要素にカーソルを合わせると、テキストの周囲の背景が白くなりますが、トップ メニューと同様に、行全体とテキストの上下を少し白くしたいと思います。 . ここに私が持っているコードがあります:

.child-sidebar-menu
{
    background-color: #DEDEDE;
}

.advanced-sidebar-menu ul li a{

text-decoration: none;
color: black;
border-bottom: 0px;
}

.advanced-sidebar-menu ul li a:hover{
text-decoration: none;
border-bottom: 0px;
}

.advanced-sidebar-menu li > ul li a:hover
 {
   color: black;
background-color: white;
 }

.advanced-sidebar-menu ul ul li a{
font-weight: normal;
font-size: 100%;
border-bottom: 0px;
}

.advanced-sidebar-menu ul{
margin: 0 0 0 0px;
list-style: none;
list-style-type: none;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
border-bottom: 0px;
line-height: 200%;
}

.advanced-sidebar-menu ul li{
    list-style:none;
    list-style-type: none;
border-bottom: 0px;


}

.advanced-sidebar-menu li.current_page_item{

    list-style-type: none;
border-bottom: 0px;
}

.advanced-sidebar-menu li.current_page_item a{
    font-weight: bold;
border-bottom: 0px;
}

これを行う簡単な方法はありますか？ボーダーとマージンに関係がありますか？

ありがとうございました。

4

2 に答える 2

0

私はあなたのサイトをプレイしてみましたが、これを思いつきました。これがあなたの望むものであることを願っています. あなたの

.advanced-sidebar-menu li > ul li a:hover
 {
   color: black;
background-color: white;
 }

に

.advanced-sidebar-menu li > ul li:hover
 {
   color: black;
background-color: white;
 }
于 2013-08-02T03:42:12.637 に答える
0

この JSFiddle を確認してください: http://jsfiddle.net/D5sdT/

重要なポイントは次のとおりです。

  1. タグを<a>作成しdisplay : blockます。これにより<a>、完全な水平スペースを占有できます。li
  2. からpaddingとを削除します。代わりに に同じものを与えます。margin<li><a>
于 2013-08-02T03:42:42.613 に答える