wordpressのメニューをドロップダウンにしたいのですが、できません。私のサイトはhttp://www.cambodialife.mobi/ です。
参考にしたサイトはhttp://tsuchiyashutaro.com/archives/3973#comment …です。
style.css ならびにheader.php
に加筆修正したのですが、カテゴリーごとには表記されるものの
「ダウン表記」になりません。
どなたか原因わかりましたら教えてください。
よろしくお願いいたします。
A 回答 (1件)
- 最新から表示
- 回答順に表示
No.1
- 回答日時:
そんな酷いHTML書いてたら、他人どころか自分ですら手がつけられない。
確か何度もアドバイスしていると思いますが・・。
スタイルシートを書くときは正当なHTMLが必要です。スタイルを書き始める前にAnother HTML Lint - Gateway( http://www.htmllint.net/html-lint/htmllint.html )などでチェックすることは必須です。
★ul内にdivは置けません。
HTMLは率直にこれだけで良いです。/ルートからのパスなのでどのページにおいても良いし、includeで使いまわしもできる。
無駄なものは一切書かない。
あとは子孫セレクタや要素セレクタ、隣接セレクタを駆使するだけですから簡単でしょう。
<nav>
_<h2>MENU</h2>
_<ul>
__<li><a href="/category/cambodia">カンボジア</a>
___<ul>
____<li><a href="/category/cambodia/anything">いろいろ</a></li>
____<li><a href="/category/cambodia/youtube">ぢゃがいもチャンネル</a></li>
___</ul>
__</li>
__<li><a href="/category/cambodia/sightseeing">観光スポット</a>
___<ul>
____<li><a href="/category/cambodia/sightseeing/karaoke">カラオケ</a></li>
___</ul>
__</li>
___<li><a href="/category/cambodia/secrity">治安</a>
____<ul>
_____<li><a href="/category/cambodia/secrity/ebola">エボラ出血熱、デング熱</a></li>
____</ul>
___</li>
___<li><a href="/category/cambodia/eating">食事</a>
____<ul>
_____<li><a href="/category/cambodia/eating/phnompenh">プノンペン</a>
______<ul>
_______<li><a href="/category/cambodia/eating/phnompenh/restaurants-phnonpenh">レストラン</a>
________<ul>
_________<li><a href="/category/cambodia/eating/phnompenh/restaurants-phnonpenh/japanese">日本食</a></li>
_________<li><a href="/category/cambodia/eating/phnompenh/restaurants-phnonpenh/western">洋食</a></li>
_________<li><a href="/category/cambodia/eating/siemreap/restaurants/chinese">中華料理</a></li>
_________<li><a href="/category/cambodia/eating/siemreap/restaurants/khmer-siemreap">クメール料理</a></li>
_________<li><a href="/category/cambodia/eating/siemreap/restaurants/korean-siemreap">韓国料理</a></li>
________</ul>
_______</li>
______</ul>
_____</li>
_____<li><a href="/category/cambodia/eating/siemreap">シェムリアップ</a>
______<ul>
_______<li><a href="/category/cambodia/eating/siemreap/bar-siemreap">BAR</a></li>
_______<li><a href="/category/cambodia/eating/siemreap/cafe-siemreap">カフェ</a></li>
_______<li><a href="/category/cambodia/eating/siemreap/restaurants">レストラン</a>
________<ul>
_________<li><a href="/category/cambodia/eating/siemreap/restaurants/japanese-siemreap">日本食</a></li>
_________<li><a href="/category/cambodia/eating/siemreap/restaurants/western-siemreap">洋食</a>
__________<ul>
___________<li><a href="/category/cambodia/eating/siemreap/restaurants/western-siemreap/hamburger">ハンバーガー</a></li>
___________<li><a href="/category/cambodia/eating/siemreap/restaurants/western-siemreap/steak">ステーキ</a></li>
___________<li><a href="/category/cambodia/eating/siemreap/restaurants/western-siemreap/pizza">ピザ</a></li>
__________</ul>
_________</li>
_________<li><a href="/category/cambodia/eating/phnompenh/restaurants-phnonpenh/chinese-restaurants-phnonpenh">中華料理</a></li>
_________<li><a href="/category/cambodia/eating/phnompenh/restaurants-phnonpenh/korean-restaurants-phnonpenh">韓国料理</a></li>
_________<li><a href="/category/cambodia/eating/phnompenh/restaurants-phnonpenh/khmer">クメール料理</a></li>
_________<li><a href="/category/cambodia/eating/siemreap/restaurants/india">インド料理</a></li>
_________<li><a href="/category/cambodia/eating/siemreap/restaurants/dessert">デザート</a></li>
________</ul>
_______</li>
______</ul>
_____</li>
____</ul>
___</li>
___<li><a href="/category/cambodia/move">移動</a>
____<ul>
_____<li><a href="/category/cambodia/move/domestic">国内の移動</a>
______<ul>
_______<li><a href="/category/cambodia/move/domestic/tuktuk">トゥクトゥク</a></li>
_______<li><a href="/category/cambodia/move/domestic/bike">バイク</a></li>
_______<li><a href="/category/cambodia/move/domestic/bus">バス</a>
________<ul>
_________<li><a href="/category/cambodia/move/domestic/bus/phonmpenh">プノンペンーシェムリアップ</a></li>
________</ul>
_______</li>
______</ul>
_____</li>
・・・【中略】・・・
___<li><a href="/question">お問い合わせ</a></li>
__</ul>
_</ul>
</nav>
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- その他(プログラミング・Web制作) .htaccessファイルの修正がこれで問題ないかどうか 1 2022/04/21 08:42
- WordPress(ワードプレス) Wordpress テーマを編集 の編集する枠が表示されない 2 2022/11/19 11:07
- HTML・CSS Affinger6でトップページに記事をタイル状に並べたい 1 2023/05/20 14:55
- WordPress(ワードプレス) httpからhttpsへのリダイレクト設定について 2 2022/04/17 09:49
- UNIX・Linux 【初心者】aws lightsail で自作のオリジナルテーマのwordpressを設定する方法 1 2022/07/14 09:46
- PHP WordpressのPHPを安全に編集する方法 1 2022/08/04 01:43
- WordPress(ワードプレス) wordpressでphpを読み込みたい 1 2022/10/30 23:40
- WordPress(ワードプレス) ワードプレスで、投稿一覧ページにタグを表示する方法 投稿につけたタグを、記事一覧ページにもカテゴリと 1 2023/05/10 21:41
- WordPress(ワードプレス) Wordpressをハッキングされない方法 4 2022/06/11 04:15
- WordPress(ワードプレス) wordpress などのcmsの普及によって、htmlの知識の価値は下がりますが、サイトに手を加え 1 2022/03/31 20:16
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
画像にリンクを張ると画像がず...
-
ポップアップメニューを表のよ...
-
リストの数字のフォントサイズ...
-
ポップアップメニューの作成方...
-
HTMLで組織図を作成する方法
-
<li>でドロップダウンボタンを...
-
<table>の高さ固定。情報増加時...
-
html <ul></ul>の並びで一行空...
-
「olタグ」内に「hタグ要素」...
-
リンク文字同士の間隔を開ける...
-
バーナーヘッダーを固定する方法
-
罫線の長さが可変するテキスト...
-
タイトルの横にサブタイトルが並ぶ
-
css 横並びのナビゲーションバ...
-
ol、liをスタイルシートで中央寄せ
-
画像横のテキストをセンターに...
-
HTMLで語の先頭をそろえるには?
-
テーブル内のプルダウンの下に...
-
「・」(黒い点)を非表示にした...
-
CSSでリスト[li]の表示がズレる
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
リストマーカーをボックス内に...
-
番号付きリスト(<Ol><Li>・・...
-
liタグの中に<p>タグやら<dl>を...
-
レスポンシブWebデザインでリン...
-
<table>の高さ固定。情報増加時...
-
<ul><li></li></ul>にするメリ...
-
リストの数字のフォントサイズ...
-
HTMLで組織図を作成する方法
-
ulタグやliタグの中でbrタグ...
-
divタグ内のコンテンツが重なっ...
-
画像にリンクを張ると画像がず...
-
複数行にまたがる括弧を表示し...
-
ページを開いているときのリン...
-
html <ul></ul>の並びで一行空...
-
html/cssの、navを2段にする...
-
HTML5のfooterに見出しを付けて...
-
<ul>~</ul>が二つ続くと間に改...
-
htmlの<ol>タグで、数字などを...
-
リンク文字同士の間隔を開ける...
-
CSSでつくったメニューのアニメ...
おすすめ情報