• ベストアンサー
※ ChatGPTを利用し、要約された質問です（原文：ナビゲーション表示のCSSについて質問させて下さい。）

ナビゲーション表示のCSSについて質問する

このQ&Aのポイント
  • ナビゲーション表示のCSSの各メニューの幅を統一する方法について教えてください。
  • 現在試しているソースコードではwidthプロパティを設定してもメニューの幅が変わりません。
  • アドバイスをいただけると助かります。
  • HTML
  • 回答数2
  • ありがとう数9

質問者が選んだベストアンサー

  • ベストアンサー
  • zeff
  • ベストアンサー率69% (137/198)
回答No.1

display:inlineにしたものにwidthは効きません。 代わりにaにdisplay:blockを指定してください。 liをinlineにするってことは横並びメニューですよね？ aにさらにfloat:leftをしてやりましょう。 ・ulとliに適当に幅をつけました。 ・ulに初期値で（ブラウザが）paddingを取るので消しておきます。 ・widthとpaddingを同時に指定するとIE6でバグが起こるので、横の余白は指定しないでください。text-align:center;にするだけ。 ・floatさせるとulの高さがなくなってしまうので、ulにheightを指定し、aのline-heightを同じ値にしてください。これで縦の余白を取ります。 <style type="text/css"> <!-- body{margin: 0px;padding: 0px;} ul{ list-style: none; width:700px;/*140x5*/ height:2em; margin: 30px 0px; padding:0; color: #fff; } li{ display: inline; white-space: nowrap; } li a{ float:left; display:block; width:140px; line-height:2em; text-align: center; text-decoration: none; color: #fff; background: transparent; background: #f60; } li a:hover { color: #fff; background: #fc0; } --> </style> </head> <body> <ul> <li><a href="A.html">項目Ａ</a></li> <li><a href="B.html">項目Ｂ</a></li> <li><a href="C.html">項目Ｃ</a></li> <li><a href="D.html">項目Ｄ</a></li> <li><a href="E.html">項目Ｅ</a></li> </ul> </body> </html>

a4_chapp
質問者

お礼

zeffさま はじめまして。早速のアドバイス、ご丁寧な対応をありがとうございます。 改めてスタイルシートって奥が深いな・・と思いました。勉強になりました。ありがとうございます。

全文を見る
すると、全ての回答が全文表示されます。

その他の回答 (1)

  • ORUKA1951
  • ベストアンサー率45% (5062/11036)
回答No.2

CSSにいくつか基本的なミスがあります。 color: #fff; /* 一部のブラウザは16進数は二桁出ないとだめ。あるいはrgb()で */ background: #f60; /* これは、#F06000かrgb()で */ inline要素にはボックスとして寸法を指定できません。 　9.2.1 ブロック要素とブロックボックス ( http://www.swlab.it.okayama-u.ac.jp/man/rec-css2/visuren.html#q5 ) 次のように設定します。 <ul> これをブロック要素にしてmarginとpadding、 　|　　　　　　　　および全体のサイズを決定する 　|　注) list-styleをnoneにする。(IEはbockにしても 　|　　　このプロパティが残っている) 　|　注) ブラウザによってデフォルトのmargin,padding値 　|　　　が異なる。ulではなくliに持っている場合もある。 　|　　そのため、一括して指定するほうが効率的 　|　注) 内包するブロックにfloatさせるためrelativeかabsolute 　| 　|-- <li>これもブロック要素にしてfloatをかける。 　|　　　| 注)　floatは親コンテナブロックがstatic以外であること 　|　　　|　注)　ここでもmargin,paddingは明示的に指定すること 　|　　　| 　|　　　|-- <a href="A.html">項目Ａ</a> 　|　　　　 注) ブロック内でリンクを有効にするならこれもblockにする 　|　　　　 　|-- <li>　以下同様 　|--　　|-- <a href="B.html">項目Ｂ</a> 具体的なソースの例 HTML <ul class="nav"><!-- HTML5ではnav要素が導入されるはず --> <li><a href="A.html">項目Ａ</a></li> <li><a href="B.html">項目Ｂ</a></li> <li><a href="C.html">項目Ｃ</a></li> <li><a href="D.html">項目Ｄ</a></li> <li><a href="E.html">項目Ｅ</a></li> </ul> CSS:最もシンプルでブラウザに依存しない。 firefox,Opera,safari,GoogleChrome,InternetExplorer ul.nav,ul.nav li{display:block;margin:0px;padding:0px;border:solid 0px blue;list-style:none;} ul.nav{width:100%;height:40px;line-height:40px;position:relative;text-align:center;} ul.nav li{width:20%;float:left;} ul.nav li a{display:block;width:99%;height:100%;margin-left:1%;background-color:white;text-decoration:none;} ul.nav li a:link{background-color:rgb(180,180,180);} ul.nav li a:visited{background-color:rgb(112,112,112);} ul.nav li a:focus,ul.nav li a:hover{background-color:rgb(255,180,0);} ul.nav li a:active{background-color:rgb(255,255,0);}

a4_chapp
質問者

お礼

ORUKA1951さま はじめまして。ご親切な対応をありがとうございます。 見るべきところとか、考えさせられました。勉強になります。ありがとうございます。

全文を見る
すると、全ての回答が全文表示されます。
  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. HTML

関連するQ&A

  • ＣＳＳで思うようにいかないところがあります。

    現在ＣＳＳ勉強中の初心者です。 ＣＳＳを使って、ナビゲーションシステムを作ろうと、本に書いてある通り、打ち込んでみたのですが、borderで囲まれた部分を1行にしたいのですが、なぜか、2行になってしまっているようです。上の行には表示させたい文字が書かれているのですが、下の行が空欄になってしまって、スペースができてしまいます。ＣＳＳの書き方が悪いのでしょうか？解決方法を教えてください。うまく説明できなくてわかりにくいかもしれませんが、宜しくお願いいたします。 ＣＳＳは以下です。 #nav { margin: 0px; padding: 0px; list-style: none; float:left; width:100%; } #nav li { float:left; background-color:#f0f0f0; border: 1px solid #000; font-size:12px; text-align:center; width:160px; height:20px; margin-top:1px; margin-right:0px; margin-left:3px; } #nav a{ color:#000; width:170px; height:20px; display:block; } #nav a:hover{ color:#fff; background-color:#0f314e; text-decoration:none; height:20px; } HTMLは以下です <ul id="nav"> <li><a href="">ホーム</a></li> <li><a href="">Gallery</a></li> <li><a href="">プロフィール</a></li> <li><a href=""></a>お問い合わせ</li> </ul>

    • ベストアンサー
    • HTML
  • cssのみ使用したプルダウンメニュー

    はじめまして。 cssのみを使ってプルダウンするメニューを作ろうとしているのですが、上手くいきません。 コードとcssは以下です。 aboutにロールオーバーすると子孫リストがプルダウンする、というようにしたいです。 .main li .sub{ visibility:hidden; } で子孫リストは消えるものの、 .main li : hover .sub{ visibility:visible; } と設定しても現れてくれません。 どうすれば上手くいくでしょうか。 すみませんがよろしくお願いします。 ・html <nav class="common_width"> <ul class="main"> <li><a href="#">profile</a></li> <li><a href="#">about</a> <ul class="sub"> <li><a href="#">profile</a></li> <li><a href="#">blog</a></li> <li><a href="#">itai</a></li> </ul> </li> <li><a href="#">test</a></li> </ul> </nav> ・css li{ list-style:none; } .common_width{ width:900px; margin:0 auto; } a { color: #000; text-decoration: none; transition: background 0.3s ease 0s, color 0.3s ease 0s; } /*全部のリスト*/ nav li{ width:150px; } /*直下のul*/ nav > ul{ width:650px; margin:0 auto; overflow:hidden; } /*直下のリスト*/ nav .main li{ float:left; color: #9f9f9f; position: relative; margin-left:100px; } nav .main li:first-child{ border-left:none; margin-left:0px; } nav ul>li a{ padding:10px 0 10px 0 ; background-color: #ccc; display: block; text-align: center; line-height:1; } nav li:hover > a{ color: #fff; background-color: #000; } .main li .sub{ visibility:hidden; } .main li : hover .sub{ visibility:visible; } nav ul li a:hover{ color: #fff; display:block; background-color: #000; } nav .sub li { font-size: 12px; color:#fff; border-top:1px dotted #fff; text-align:center; margin-left:0px; }

    • ベストアンサー
    • HTML
  • CSS+HTMLだけで画像を使わず、角丸タブメニューを作りたい

    職場でネットショップのWEB管理をしているものですが、サイト上のヘッダーに画像を使わずCSS+HTMLだけで角丸タブメニューっぽいものを作りたいのですが、なんせCSS初心のためどこをどう指定すれば画像なしの角丸タブメニューっぽくなるのかわかりません。できたら各メニューの下段にもサブメニューリンクを追加したいのですが・・・ どうか良きアドバイスよろしくお願いします。 感じとしてはここのサイトっぽいタブメニューができればと・・・ CSS <style type="text/css"> <!-- #demo-container{padding:2px 2px 0 60px;margin:0 0 15px 0;background:#67A897;width:870px;} ul#simple-menu{list-style- type:none;width:100%;position:relative;height:27px;font- family:"inpact",Arial,sans-serif;font-size:13px;font- weight:bold;margin:0;padding:11px 0 0 0;} ul#simple-menu li{display:block;float:left;margin:0 0 0　9px;height:27px;} ul#simple-menu li.left{margin:0;} ul#simple-menu li a{display:block;float:left;color:#fff; background:#4A6867;line-height:27px;text-decoration:none; padding:0 17px 0 18px;height:27px;} ul#simple-menu li a.right{padding-right:19px;} ul#simple-menu li a:hover{color:#;background:#708090;} ul#simple-menu li a.current{color:#708090;background:#fff;} ul#simple-menu li a.current:hover{color:#9370DB;background:#fff;} --> </style> HTML <div id="demo-container"> <ul id="simple-menu"> <li><a href="#" title="MENU1" class="current">MENU1</a></li> <li><a href="#" title="MENU2">MENU2</a></li> <li><a href="#" title="MENU3">MENU3</a></li> <li><a href="#" title="MENU4">NENU4</a></li> <li><a href="#" title="NENU5">NENU5</a></li> <li><a href="#" title="NENU6">NENU6</a></li> </ul> </div>

    • ベストアンサー
    • HTML
  • CSSで外部ファイルのスタイルが読み込めません

    不思議なことに<style>で囲った場合は、うまくいき、外部ファイル(link href)でcssを読み込んだときは、一部のレイアウト指定が乱れてしまいます。 HTML部分は <ul id="menu_bar"> <li><a href="#">メニュー項目</a></li> <li><a href="#">メニュー項目</a></li> <li><a href="#">メニュー項目</a></li> <li><a href="#">メニュー項目</a></li> <li><a href="#">メニュー項目</a></li> </ul> CSS　部分は #menu_bar { width: 100%; height: 45px; padding: 0; margin: 0; margin-bottom: 2px; list-style-type: none; background: #ff7400; position: fixed; bottom: 0px; left: 0px; box-shadow: 0px -3px 15px rgba(0,0,0,0.4); // ボックス上に影をつける } #menu_bar li { width: 20%; float: left; padding: 0; margin: 0; text-align: center; border-spacing: 2px 2px; border-collapse: separate; } #menu_bar li a { width: auto; color: #fff; font-size: 14px; font-weight: bold; margin: 0; padding: 12px 0; text-decoration: none; display: block; } #menu_bar li a:hover { background: #ffa443; } です。 外部ファイルと直接<style>で記述するときに違いが出るのは初めてです。考えられる原因が何かありますか？どのようにレイアウトが異なるかを画像添付しました。よろしくお願いします。

    • ベストアンサー
    • CSS
  • ページを開いた直後のサブメニューを非表示

    現在、個人で利用するサイトをJqueryを導入してリニューアルしようと計画しているのですが、 添付画像のように新しいページを開いた直後は、左の青いサブメニューが必ず表示されてしまいます。 ("#menu ul li ul:first").hide();を入れると 消えることには消えたのですが、 それ以後サブメニューが表示されなくなってしまいました。 どなたかお分かりの方、ご助言をお願い致します。 参考までに以下にHTMLとＣＳＳのコードを記載します。 (HTML) <html> <head> </head> <body> <div id="content"> <div id="menuWrapper" class="menuWrapper bg1"> <ul class="menu" id="menu"> <li class="bg1" style="background-position:0 0;"> <a id="bg1" href="#">Our Passion</a> <ul class="sub1" style="background-position:0 0;"> <li><a href="#">Submenu 1</a></li> <li><a href="#">Submenu 2</a></li> <li><a href="#">Submenu 3</a></li> </ul> </li> <li class="bg1" style="background-position:-266px 0px;"> <a id="bg2" href="#">Our Brands</a> <ul class="sub2" style="background-position:-266px 0;"> <li><a href="#">Submenu 1</a></li> <li><a href="#">Submenu 2</a></li> <li><a href="#">Submenu 3</a></li> </ul> </li> <li class="last bg1" style="background-position:-532px 0px;"> <a id="bg3" href="#">Contact</a> <ul class="sub3" style="background-position:-266px 0;"> <li><a href="#">Submenu 1</a></li> <li><a href="#">Submenu 2</a></li> <li><a href="#">Submenu 3</a></li> </ul> </li> </ul> </div> </div> </body> </html> (CSS) .menuWrapper{ font-family: "Trebuchet MS", Arial, sans-serif; font-size: 15px; font-style: normal; font-weight: normal; text-transform:uppercase; letter-spacing: normal; line-height: 1.45em; position:relative; margin:20px auto; height:542px; width:797px; background-position:0 0; background-repeat:no-repeat; background-color:transparent; } ul.menu{ list-style:none; width:797px; } ul.menu > li{ float:left; width:265px; height:542px; border-right:1px solid #777; background-repeat:no-repeat; background-color:transparent; } ul.menu > li.last{ border:none; } .bg1{ background-image: url(../images/1.jpg); } .bg2{ background-image: url(../images/2.jpg); } .bg3{ background-image: url(../images/3.jpg); } ul.menu > li > a{ float:left; width:265px; height:50px; margin-top:450px; text-align:center; line-height:50px; color:#ddd; background-color:#333; letter-spacing:1px; cursor:pointer; text-decoration:none; text-shadow:0px 0px 1px #fff; } ul.menu > li ul{ list-style:none; float:left; margin-top:-180px; width:100%; height:110px; padding-top:20px; background-repeat:no-repeat; background-color:transparent; } ul.menu > li ul li{ display:none; } ul.menu > li ul.sub1{ background-image:url(../images/bg1sub.png); } ul.menu > li ul.sub2{ background-image:url(../images/bg2sub.png); } ul.menu > li ul.sub3{ background-image:url(../images/bg3sub.png); } ul.menu > li ul li a{ color:#fff; text-decoration:none; line-height:30px; margin-left:20px; text-shadow:1px 1px 1px #444; font-size:11px; } ul.menu > li ul.sub1 li{ display:block; } ul.menu > li ul li a:hover{ border-bottom:1px dotted #fff; }

  • CSSの「a」と「a:link」の違いを教えてください。

    CSSでリストを横に並べて、グローバルナビゲーションを作っているのですが、aとa:linkの違いがわかりません。 例えばHTMLは以下のように <div id="gNavi"> <ul> <li><a href="../omotenashi.html">おもてなし</a></li> <li><a href="../stay.html">過ごし方</a></li> <li><a href="../rooms.html">客室</a></li> <li><a href="../facilities.html">館内施設</a></li> <li><a href="../dish.html">料理</a></li> <li class="last"><a href="../onsen.html">温泉</a></li> </ul> </div> CSSは #gNavi { height: 60px; width: 960px; margin-right: auto; margin-left: auto; } #gNavi ul { text-align: center; } #gNavi ul li { display: inline; border-right-width: 1px; border-right-style: solid; border-right-color: #FFF; width: 159px; float: left; } #gNavi ul li.last { border-right-style: none; } #gNavi ul li a { background-color: #F00; width: 159px; float: left; } #gNavi ul li a:hover { background-color: #09F; color: #FFF; width: 159px; float: left; } という風に書きますが（間違っているかもしれません。）、#gNavi ul li aを#gNavi ul li a:linkと書いてはいけないのでしょうか？ aとa:linkの違いはなんですか？

    • ベストアンサー
    • HTML
  • CSSの継承について...

    CSSの勉強をしつつ、HPビルダー17を使ってHPの制作しているですが、 前のulタグで使った背景画像がずっと継承されて困っております。 当方の内容です↓ 【CSS記述】 ----------------------- #manu-nanyo{ display: block; position: absolute; background-image: url(fu/area_nanyo.png); background-repeat: no-repeat; background-position: center top; color: black; width: 200px; height: 40px; } .job-menu ul{ display: block; list-style-type: none; margin-top: 0px; margin-right: auto; margin-bottom: 0px; margin-left: auto; padding-top: 10px; padding-bottom: 10px; border-right-width: 1px; border-right-style: solid; border-right-color: silver; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: silver; text-decoration: none; } .job-menu li{ margin: 0; padding: 0; background: url(img/migi_aka.png) left no-repeat; } .job-menu a{ display: block; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 14px; color: black; font-size: 15px; text-decoration: none; } .job-menu a:hover{ background-color: rgb(204, 204, 204); color: red; } #newshop_bunner{ frot: left; width: 200px; padding-top: 10px; text-align: left; background-position: top left; } .newshop-banner ul{ margin-top: 20px; margin-left: 0; padding-left: 0; } .newshop-banner li{ text-decoration : none; text-align : right; font-size: 12px; } .newshop-banner a{ margin-top: 0px; padding-top: 5px; padding-right: 0px; padding-bottom: 5px; padding-left: 0px; color: blue; font-size: 12px; text-decoration: none; text-align: right; } .newshop-banner a:hover{ background-color: white; color: lime; } ul.sample{ width:100%; margin-top:20px; font-size:10px; padding-left:0; margin-left:0; } ul.sample li{ list-style-position: outside; background-color: transparent; background-repeat: repeat; background-attachment: scroll; background-position: 0% 0%; background-size: auto auto; background-origin: padding-box; background-clip: border-box; padding-top: 3px; padding-right: 10px; padding-bottom: 3px; padding-left: 10px; width: 120px; float: left; border-width: 2px; border-color: rgb(255, 238, 219); border-style: ridge; } .list-test1{ float: left; list-style-type: none; margin-top: 40px; padding-top: 40px; color: orange; } 【HTML記述】 ----------------------- <div id="manu-nanyo"> <div class="job-menu"> <ul> <li><a href="*">野球</a> <li><a href="*">サッカー</a> <li><a href="*">テニス</a> <li><a href="*">ゴルフ</a> <li><a href="*">バスケ</a> </ul> </div> <div id="newshop_bunner"><img src="img/newstore-img.png" alt="新店舗"> <ul class="newshop-banner"> <li><a href="*"><img src="#">店名○○○○○お店ネーム</a> <li><a href="*"><img src="#">店名○○○○○お店ネーム</a> </ul> <ul class="sample"> <li><a href="#">テスト1</a> <li><a href="#">テスト2</a> <li><a href="#">テスト3</a> <li><a href="#">テスト4</a> <li><a href="#">テスト5</a> </ul> <ul class="list-test1"> <li><a href="#">トップページ</a> <li><a href="#">テストページ1</a> <li><a href="#">テストページ2</a> </ul> </div> ----------------------- .job-menu li　で使った背景画（矢印）・スタイルが、その後 li を使う度に継承されてしまいます。 クラス名やID名を付けてそれぞれの属性を指定すれば分居ができるのかと色々と試してみたのですが旨くいかず・・・ (ul属性・a属性で分けても継承されてしまいます） 試し過ぎて、もう意味が分からなくなってしまって自分では解決出来そうにないので、初歩的なことで申し訳ありませんが、質問をさせて頂きました。 ネット等で調べた感じでは、「クラスを分けて指定すればulの住み分けが出来る」と判断したのですが、そういうことではないのでしょうか？ それとも根本的な何かを履き違えしているのでしょうか？ 宜しくお願い致しますm(_ _)m

  • [CSS3] last-childについて

    html5とcss3にてスマートフォンサイト制作をしております。 リスト要素を使いメニューを作っていますが、一番下の要素だけボーダーを削除したいと 思っていますが、うまくいきません。 詳しい方、ご教授いただけませんでしょうか。　よろしくお願い致します。 ---------------------------------------------------------- [HTML] <nav> <ul id="navi"> <a href="#"><li>メニュー1</li></a> <a href="#"><li>メニュー2</li></a> <a href="#"><li>メニュー3</li></a> <a href="#"><li>メニュー4</li></a> <a href="#"><li>メニュー5</li></a> </ul> </nav> [CSS] nav { display: block; width: 300px; margin-right: auto; margin-left: auto; margin-bottom: 18px; } #navi { border-radius: 8px; -webkit-border-radius: 8px; border: 1px solid #CCCCCC; background: -webkit-gradient(linear, left top,left bottom, from(#FFFFFF), to(#E7E7E7)); background-color: #FFFFFF; } #navi a { text-decoration: none; color: #646464; font-size: 1.31em; text-indent: 16px; height: 33px; line-height: 33px; } #navi li { border-bottom: 1px solid #CCCCCC; } #navi li:last-child { border-bottom-style: none; }

    • ベストアンサー
    • CSS
  • CSSのみでプルダウンメニューを作りたい

    こんにちは。 WEB制作は全くの素人です。 CSSのみで下記のようなプルダウンメニューを作りたいのですが、 どうにもならず困っています。 http://c-brains.jp/blog/wsg/08/06/05-155929.php 現在使用中のCSS -------------------------------------- #header-menu { height: 23px; background-color: #333333; margin: 0px; padding: 8px 0 0 15px; background: url(img/head_menu_back.gif); background-repeat: repeat-x; text-align: left; width: auto; } #header-menu ul { text-align: left; margin: 0px; padding: 0px } #header-menu li { color: #ffffff; display: inline; padding-left: 13px; padding-right: 8px; background: url(img/l_icon.gif) no-repeat; background-position: left center; } #header-menu a { color: #ffffff; text-decoration: none; } #header-menu a:hover { color: #cccccc; } ------------------------------- 現在使用中のhtml -------------------------------- <div id="header-menu"> <ul> <li><a href="index.html">HOME</a></li> <li><a href="profile1.html">会社情報</a></li> <li><a href="service1.html">サービス</a></li> <li><a href="ethic1.html">企業理念</a></li> <li><a href="contact1.html">お問合わせ</a></li> <li><a href="job1.html">採用情報</a></li> <li><a href="indexeng.html">English</a></li> </ul> </div> ------------------------------------------------ 上記の各項目に追記しプルダウン式のリストにしたいです。 (カーソルを上にのせるとリストが開っく感じのものを希望します。） 恐れ入りますが、どなたかご教授いただきたくお願い致します。

  • 縦並びメニューの枠線が重ならない

    いつもこちらではお世話になり、ありがとうございます。 ｃｓｓのli:hoverを使ってサブメニューを表示させようとしていますが、 縦並びのサブメニューの枠線が重なってくれません。 どこが間違えているのでしょうか。 ご指摘をお願いいたします。 （素人ですので、他にもつっこみどころがかなりあると思います。 すみません（汗）） 【html】 <ul class="menu"> <li><a href="menu1.html" >メニュー１</a></li> <li><a href="menu2.html">メニュー２</a> <ul> <li><a href="submenu1.html">サブメニュー１</a></li> <li><a href="submenu2.html">サブメニュー２</a></li> </ul> </li> <li><a href="menu3.html" >メニュー３</a></li> <li><a href="menu4.html" >メニュー４</a></li> </ul> 【css】 ul.menu { margin: 0px; padding:0; list-style-type : none; } ul.menu li { margin:0; float:left; width: 107px; line-height: 43px; } ul.menu li a{ display:block; text-align:center; text-decoration: none; background-image: url(images/navi_b.png); background-repeat: no-repeat; color: #202020; font-family: "メイリオ"; font-size: 11px; } ul.menu li a:hover{ background-image: url(images/navi_r.png); } ul.menu li ul{ display: none; position: absolute; top: 165px; left: 210px; list-style-type : none; background-image: none; } ul.menu li:hover ul{ display: block; } ul.menu li ul li{ clear: left; width: 106px; line-height: 35px; border: 1px #989590 solid; border-collapse: collapse; } ul.menu li ul li a{ background: none; background-color:#B28872; color:#ffffff; } ul.menu li ul li a:hover{ background: none; background-color: #643E3E; color:#ffffff; } よろしくお願いします。

    • ベストアンサー
    • HTML

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する