子要素をもつ親のホバーカラー css

http://weboook.blog22.fc2.com/blog-entry-383.html

1
2
3
4
5
6
7
8
9
10
11
12
13
/*さいど子メニュー持ち子の親背景 色*/
 
.secondary-navigation li:hover > a
    {
    background-color: #FFA70A!important;
    color: #fff!important;
    }
     
.primary-navigation li:hover > a,
    .primary-navigation li.focus > a {
        background-color: #FFA70A!important;
        color: #fff!important;
    }

li:hover > a とすると
その子要素にいる間 ホバーし続ける

ちなみに

上記
14のさいど 上メニューのタイトルのcss

1
2
3
4
5
/*さいど子メニュー持ち子の背景*/
.secondary-navigation ul ul{background-color: #72DFB8!important;}
.secondary-navigation ul ul li a:hover{background-color: #FFA70A!important;}
.primary-navigation ul ul{background-color: #72DFB8!important;}
.primary-navigation ul ul li a:hover{background-color: #FFA70A!important;}

こいつも必要

さらにしいていえば

1
@media screen and (min-width: 1008px) {}

こいつで囲む

つまり スマフォとかでは効いてほしくないんだ