ヘッダー側にグローバルナビが付いてるなら、フッターにも無いといけないだろ?とか思いながら、フッターへグローバルナビを追加しました。
上と下でコンテンツをがっちり挟む形になりました。
<li>がセンターに行かねえな??と小1時間くらい悩んでいましたが、display:inline;なのにfloat使っちゃ、そりゃ行かねえだろ!?と気づき、ようやく完成しました(-.-;)
CSS
/*------FOOTER グローバルナビ------*/
#footin ul.fnavi{
margin:0px 0px 10px;
padding:0px;
list-style-type:none;
text-align:center;
}
#footin ul.fnavi li{
display:inline;
font-size:12px;
vertical-align:center;
border-left:1px solid white;
}
#footin ul.fnavi li.first{
border:none;
}
#footin ul.fnavi li a{
padding:0px 15px;
color:white;
text-decoration:none;
}
#footin ul.fnavi li a:hover{
color:#ff0;
text-shadow:0px 0px 10px #ff0;
}
#footin ul.fnavi{
margin:0px 0px 10px;
padding:0px;
list-style-type:none;
text-align:center;
}
#footin ul.fnavi li{
display:inline;
font-size:12px;
vertical-align:center;
border-left:1px solid white;
}
#footin ul.fnavi li.first{
border:none;
}
#footin ul.fnavi li a{
padding:0px 15px;
color:white;
text-decoration:none;
}
#footin ul.fnavi li a:hover{
color:#ff0;
text-shadow:0px 0px 10px #ff0;
}
HTML
<ul class="fnavi">
<li class="first"><a href="<$blog_url>" title="<$blog_name> TOP">TOP</a></li>
<li><a href="URL" title="ページ名">ページ名</a></li>
<li><a href="URL" title="ページ名">ページ名</a></li>
<li><a href="URL" title="ページ名">ページ名</a></li>
<li><a href="URL" title="ページ名">ページ名</a></li>
</ul>
<li class="first"><a href="<$blog_url>" title="<$blog_name> TOP">TOP</a></li>
<li><a href="URL" title="ページ名">ページ名</a></li>
<li><a href="URL" title="ページ名">ページ名</a></li>
<li><a href="URL" title="ページ名">ページ名</a></li>
<li><a href="URL" title="ページ名">ページ名</a></li>
</ul>
※URL及びページ名は書き換えてからご使用下さい。
※'TOP'がイヤなら'HOME'または「ホーム」など変え方はいろいろあります。
※TOPのURLの独自タグは上記でOKです。
このブログの<$blog_url>にはhttp://blog.town-nets.com/blogtemplate/が格納されています。
このブログの<$blog_name>には「ブログテンプレート制作目録」が格納されています。
関連記事