1

WordPressTwentyTenテーマのトップメニューをスタイリングしています。

最初のメニュー項目のすべてのサブメニューの幅を200ピクセルにします。

2番目のメニュー項目のすべてのサブメニューの幅は250ピクセルで、

3番目のメニュー項目のすべてのサブメニューの幅は300ピクセルです。

たとえば、メニューの構造は次のとおりです。

約

  • ミッション
  • 歴史
  • 人々

サービス

  • サービス1
  • サービス2
  • サービス3

製品

  • 製品1
  • Product2
  • Product3

ABOUTの下のすべてのアイテムの幅を200ピクセルにし、SERVICESの下のすべてのアイテムの幅を250ピクセルにし、PRODUCTSの下のすべてのアイテムの幅を300ピクセルにします。

CSSのみを使用してWordPressでそれらを選択するにはどうすればよいですか？（メニューが動的に生成され、ヘッダーにwp_nav_menuコマンドしかないことを考慮しますか？）

4

2 に答える 2

2

外観/メニュー管理インターフェイスページで定義されたカスタムメニュー構造を使用していると仮定すると、そこから各サブメニュー項目にCSSクラスを追加できます。

管理ページに移動し、上部にある[画面オプション]を選択します。その下に、[詳細メニューのプロパティを表示する]の下に一連のチェックボックスがあります。そのひとつが「CSSクラス」です。このボックスにチェックマークを付けると、各サブメニューオプションペインに、1つ以上のクラスを追加できる[CSSクラス（オプション）]テキストボックスが表示されます。

それが終わったら、心ゆくまでスタイリングできます...

于 2011-05-31T12:50:41.770 に答える
0

各レベルに一致する CSS セレクターを使用します。このような：

#access ul {
   width: 200px;
}
#access ul ul {
   width: 250px;
}
#access ul ul ul {
   width: 300px;
}
于 2011-05-31T06:00:14.593 に答える