2

http://misha.pixelworklab.com/mercedes-sl/

現在の状態で「MERCEDES」タブが表示されますが、これは正しいですが、サブメニューを別の現在の状態にする必要があります..すべてのセレクターを試してみましたが、何かが欠けているようです..ありがとう!

試し.current-menu-item > aましたが、サブ要素のセレクターを取得できません。

ここに画像の説明を入力

4

2 に答える 2

1

Firefox に組み込まれているCSS インスペクター ツールhoverは、アクティブな状態の外観をカスタマイズするために必要なセレクターを見つけるのに役立ちます。

ナビゲーション リンクをホバリングするためのCSS アクティブ ステート セレクターは次のとおりです。

#megaMenu ul.megaMenu>li:hover>a span.wpmega-link-title,#megaMenu ul.megaMenu>li:hover>span.um-anchoremulator span.wpmega-link-title,#megaMenu ul.megaMenu>li>a:hover span.wpmega-link-title,#megaMenu ul.megaMenu>li>span.um-anchoremulator:hover span.wpmega-link-title,#megaMenu ul.megaMenu>li.megaHover>a span.wpmega-link-title,#megaMenu ul.megaMenu>li.megaHover>span.um-anchoremulator span.wpmega-link-title

それは非常に複雑で非常に複雑なので、PC 上の Firefox の最新バージョンを使用して、このセレクターにたどり着いた方法を段階的に説明します。

1.)MERCEDES KITSナビゲーション リンクを右クリックし、コンテキスト メニューから [ Inspect Element(Q) ] を選択します。ここに画像の説明を入力

2.)あなたはspanタグになります。ホバリングするとred、CSS スタイルで定義されているように、テキストの色が に変わります。 ここに画像の説明を入力

3.) CSS セレクターのドロップダウン矢印をクリックし、常に状態になるようにspan強制します。 :hoverここに画像の説明を入力

4.)右下にあるスタイル ボタンを押してアクティブにします。アクティブな場合、そのボタンは青色に変わります。 ここに画像の説明を入力

5.) CSS ルール パネルの上部に、テキストの作成を担当するセレクターが表示されますred。 ここに画像の説明を入力

6.)この同じセクションで、これらのセレクター のCSS スタイルシートと行番号にアクセスできます。ここに画像の説明を入力

7.)行番号 169 は、すべてのナビゲーション アンカーのhoverアクティブ状態の外観を提供します。

/* Top Level Items Title - Hover */
#megaMenu ul.megaMenu > li:hover > a span.wpmega-link-title,
#megaMenu ul.megaMenu > li:hover > span.um-anchoremulator span.wpmega-link-title,
#megaMenu ul.megaMenu > li > a:hover span.wpmega-link-title,
#megaMenu ul.megaMenu > li > span.um-anchoremulator:hover span.wpmega-link-title,
#megaMenu ul.megaMenu > li.megaHover > a span.wpmega-link-title,
#megaMenu ul.megaMenu > li.megaHover > span.um-anchoremulator span.wpmega-link-title {
  text-shadow: 0 -1px 1px #ffffff;
  color: red !important;
}

8.) Firefox CSS ルール パネルで CSS を直接動的に編集できます。使用する色の変更の 例: 上記のステップ 5の場合:
hovercolor: yellow !important;
ここに画像の説明を入力

9.)ヒント: HTML パネル(左下から 2 番目のアイコン) を参照して、他の classname要素とid要素を表示します。 ここに画像の説明を入力

于 2013-01-10T23:42:33.483 に答える
0

サブメニューul.sub-menuとその子セレクターをターゲットにすることができます。

ul.sub-menu ul.sub-menu li ul.sub-menu li:first-child a ul.sub-menu li a ul.sub-menu li:last-child a

そういうもの。

于 2013-01-10T01:02:24.907 に答える