画像を背景画像として配置します
そうすることによりその上にテキストを表示できます
■ ナビゲーションバーの使い方 ■
設定はHTMLのTableタグのbackground= ""を使っても出来ますが、<div></div>とスタイルシートを用いて設定した方がよいでしょう。ソースは以下の様な感じでいいと思います。
使う画像のサイズと同じボックスを<div></div>で作り、その背景に画像を指定すればOKです。後は中央揃えとして、text-align:
center;を使ったりして整えます。これを<head></head>内に記述します。
なお、<div>内に配置するメニューテキストは、サンプルでは省略していますが <p></p>で各々をマークアップすべきでしょう。
その場合、縦に並べる場合は楽ですが、横に並べる場合は、<p>にスタイルシートで、float: left;を使って横に並ばせる必要が出てきます。
<style type="text/css">
<!--
{
background-image: url(sample.gif);
width: 313px;
height: 18px;
text-align: center;
font-size: 90%;
color: #FFFFFF;
}
-->
</style>
またNavi2の方を使ってこんな感じにもできます
PROFILE
DIARY
CHAT
BBS
LINK