No.1ベストアンサー
- 回答日時:
ナビゲーションは画像で指定する予定ですか。
それとも画像とテキスト、あるいはテキストのみで指定する予定ですか。
例えば背景に画像を使用して、その上にナビゲーションの文字だけを置くとすると、
----------------------------------
CSSの記述
----------------------------------
#navi {
background: url(images/navibar.jpg) no-repeat;
width: 600px; height: 30px;
}
#navi ul {
list-style: url(images/circle.gif) disc inside;
}
#navi li {
float: left; /* リストを左に並べる */
margin: 3px 1em; /* 上下・左右の外側の余白 */
}
----------------------------------
リストのマーカーを表示しない場合は「list-style: none」などとしてください。
----------------------------------
HTMLの記述
----------------------------------
<div id="navi">
<ul>
<li>AAA</li>
<li>BBB</li>
<li>CCC</li>
</ul>
</div>
----------------------------------
テキストではなく画像ならば<img src="images/aaa.gif" alt="AAA" width="画像の幅" height="画像の高さ">となります。
が、もし、AAAの下に背景画像を指定して上に文字をのせるだけでしたら、
CSSに「#navi li」の指定に「background: url(images/navibar.jpg) no-repeat;
width: 画像の幅; height: 画像の高さ;」などを加えてください。
また、文字サイズを「font-size: 14px;」などのように指定してやらないと、ブラウザで文字の大きさなどを変更した場合には、背景画像からはみ出してしまったりします。
参考URLはとほほのWWW入門のCSSの背景指定についての説明です。
先の質問がどれか判らなかったため、確認していませんので、的をはずした回答でしたらすみません。
参考URL:http://www.tohoho-web.com/css/reference.htm#back …
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- HTML・CSS アコーディオンメニューが思うように動作しません。 1 2023/08/20 16:48
- HTML・CSS テキストを画面の真ん中に配置したいです。 2 2022/11/25 16:11
- HTML・CSS htmltとcssの連携をして画像縮小について 1 2022/11/15 20:32
- HTML・CSS HTML & CSS 縦ボックス内の文字の左右センタリング 3 2023/03/25 04:23
- PHP style.cssのjQuery条件付きcssが機能しない 4 2022/07/17 18:27
- HTML・CSS ヘッダーの画像にメインエリアがかぶってしまいます 1 2022/11/28 14:06
- HTML・CSS リストの並べ替え 1 2022/09/13 15:27
- 弁護士・行政書士・司法書士・社会保険労務士 行政書士試験の民法についての質問になります。 解除についての質問になります。 問 Aが、その所有する 2 2023/07/18 17:33
- JavaScript html5に変えるとスライドショーが消えてしまった。 3 2022/03/26 19:53
- HTML・CSS htmlについて質問です! 写真のように写真の部分が?になってしまいます。 ファイルもしっかり選べて 1 2023/07/09 21:17
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
IMGタグで画像の繰り返し使用は…
-
同じ画像 複数回使用
-
lightbox2で画像を天地左右中央...
-
WEB上でディレクトリ内の画像を...
-
背景画像をリピートさせない方...
-
gif画像でたまに背景がグレーに...
-
CSS マウスオーバーでテキスト...
-
CSSでの動画のマスク処理
-
フッターの背景に色を指定した...
-
LightBoxの矢印の出し方
-
ひとつの画像をWEBで異なる小さ...
-
before疑似要素で画像を指定し...
-
背景画像の上に透過GIF背景...
-
<hr>の縦バージョンはありますか?
-
htmlタグで画像を背景に敷き詰...
-
【至急お助け!】チェックボッ...
-
サファリで背景画像が1ピクセ...
-
下記サイトのトップ画像はどの...
-
【Webサイト】画像が小さく表示...
-
画像で背景透明のテキストがに...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
画像の上にテキスト配置で、拡...
-
画像とその下にあるテキストの...
-
<hr>の縦バージョンはありますか?
-
【至急お助け!】チェックボッ...
-
【Webサイト】画像が小さく表示...
-
background-repeat CSS で切れ...
-
htmlかcssで背景の白い枠をなく...
-
background-sizeの背景で最小値...
-
lightbox2で画像を天地左右中央...
-
ページごとに背景画像を変更し...
-
LightBoxの矢印の出し方
-
WEB上でディレクトリ内の画像を...
-
IMGタグで画像の繰り返し使用は…
-
iframe内をクリックさせない方...
-
同じ画像 複数回使用
-
画像上に文字を表示するとiPhon...
-
background-sizeでcontainする...
-
ページの上下に白い横線が入る
-
コーディング中、右側に謎の余...
-
画像を複数横に並べ、かつそれ...
おすすめ情報