- 締切済み
CSSでメニュー横並びの方法
ただいま、自社サイトを制作中なのですが、 グローバルメニューを横に並べるところでつまづいています。 イメージしているグローバルメニューはこんな感じです。 http://antenna7.com/ 文字だけ画像で下のラインはcssのborderで入れたいと考えています。 またメニュー数は5つで1つの幅は180px、それぞれに15pxずつ間隔を 空けたいと考えています。(1番左は15px空けない) 自分なりに調べたのですが、<ul><li>でやるべきなのかどうなのか、 どのように組めばよいのか分かりません。 皆様、お忙しいところ申し訳ございませんが、至急よろしくお願い致します。
- みんなの回答 (2)
- 専門家の回答
みんなの回答
- ORUKA1951
- ベストアンサー率45% (5062/11036)
>グローバルメニューを横に並べるところでつまづいています。 と ><ul><li>でやるべきなのかどうなのか、 は、根本的に無関係です。--HTMLマークアップでもっとも肝要な部分== HTMLのマークアップは、文書構造にしたがって行うべきですから、デザインとは無関係にナビゲーションリンクなら、ulやol,dlでマークアップ(HTML5ならnav)すべきです。 プレゼンテーションは、それとは独立して文書構造にしたがって正しくマークアップされたHTMLをスクリーンブラウザでどのように描画するかを決めるもの。 Q: ナビゲーションリンクのリストはどのようにマークアップすべきか? HTML4.01以前ならリストで、HTML5ならnavで Q: ナビゲーションリンクを横並びで並べたい list-styleをnoneにして、項目をブロックにし、floatで並べる。 Style Sheets in HTML documents (ja) ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/present/styles.html )
- outbrave
- ベストアンサー率60% (231/380)
ほとんどおわかりのようですが イメージされたサイトは、<ul><li>ですね、ソースを見れば全部わかります。 幅は、width だし、間隔は、margin で設定できます。 css も border もご存知のようですから、わからない部分を質問されてはいかがですか。