解決済みのQ＆A

アメブロでのＣＳＳメニューの作り方を教えてください。こちらのサイト様のように...

アメブロでのＣＳＳメニューの作り方を教えてください。
こちらのサイト様のように↓
http://3ping.org/2005/08/24/0920
サンプル→http://3ping.org/2005/08/24/sample_menu02/

こんな風にブログを作りたいです
そこに記載されている

<ul id="globalNavi">
<li><a href="./">List1</a></li>
<li><a href="./">List2</a></li>
<li><a href="./">List3</a></li>
<li><a href="./">List4</a></li>
</ul>
↑をフリープラグインに貼り付ければいいのですか？
もしくはCSS Fileの

@charset "utf-8";

ul.globalNavi {
margin: 0;
padding: 0;
line-height: 1;
background-color: #eee;
list-style-type: none;
}

ul.globalNavi li {
margin: 0;
padding: 0;
float: left;
/* 固定幅にしたかったら
width: 110px;
*/
text-align: center;
font-size: 13px; /* 文字サイズ */
}

ul.globalNavi li a {
border-right: 1px solid #666;
padding: 9px 20px;
display: block;
position: relative; /* for IE6 */
color: #fff;
background-color: #333;
text-decoration: none;
}

ul.globalNavi li a:hover {
border-color: #ccc;
color: #333;
background-color: #ccc;
}

/* ClearFix */

ul.globalNavi {
_height: 1px;
min-height: 1px;
/*¥*//*/
height: 1px;
overflow: hidden;
/**/
}

ul.globalNavi:after {
height: 0;
visibility: hidden;
content: ".";
display: block;
clear: both;
}

↑ＣＳＳで作成する場合はＣＣＳの編集に貼ればいいのでしょうか？
それとも両方に貼り付けるのでしょうか？
ブログはアメブロで作成中です
最終的にこちらのページのように↓
http://myisland.jp/template/menus/horizontal1.html
トップ画の下にメニューを取り付けたいです
最後まで詳しく教えてください宜しくお願いします

違反報告

質問日時：

2010/2/2 20:18:04
解決日時：

2010/2/7 18:55:03
回答数：

2
閲覧数：

3,969
ソーシャルブックマークへ投稿：

Yahoo!ブックマークへ投稿

はてなブックマークへ投稿

（ソーシャルブックマークとは）

ベストアンサーに選ばれた回答

kiyoto_777さん

■私のナビメニュー
★ＣＳＳ部分
/* ----------------------------------------------------- */
/* ■ナビエリアフリースペース */
/* ----------------------------------------------------- */
#navlist
{
padding: 5px 5px 5px 5px;
margin-left: 0px;
font-size:18px;
font-weight: bold;
width:1500px;
}
#navlist li
{
margin:0;
padding: 0;
display: inline;
list-style-type: none;
padding: 5px 5px 5px 5px;
}
#navlist li a{
margin:0;
display: inline;
list-style-type: none;
padding: 5px 5px 5px 5px;
}
#navlist li a:link { /* 未訪問のリンクの色 */
color: #ffffff;
background-image:url(背景画像ＵＲＬ①);
padding: 5px 5px 5px 5px;
}
#navlist li a:visited { /* 訪問済みのリンクの色 */
color: #ffffff;
background-image:url(背景画像ＵＲＬ①);
padding: 5px 5px 5px 5px;
}
#navlist li a:hover { /* マウスを乗せた時のリンクの色 */
color: red;
background-image:url(背景画像ＵＲＬ②);
padding: 5px 5px 5px 5px;
}
/* トップからの位置調整 */
#freespace #navcontainer{
position: absolute;
width:1000px;
top:407px;
z-index: 100;
margin-left:-10px;
}
★フリースペース（改行はいれないこと・・・アメブロのフリースペースのため）
<div id="navcontainer"><ul id="navlist"><li><a href="ＵＲＬ">Home</a></li><li><a href=""ＵＲＬ">Room</a></li><li><a href="ＵＲＬ">Amember</a></li><li><a href=""ＵＲＬ">Message</a></li><li><a href=""ＵＲＬ">Present</a></li><li><a href=""ＵＲＬ">Peta</a></li><li><a href=""ＵＲＬ">Now</a></li><li><a href=""ＵＲＬ">Reader</a></li><li><a href=""ＵＲＬ">Community</a></li><li><a href=""ＵＲＬ">Slide show</a></li><li><a href=""ＵＲＬ">Guest book </a></li></ul></div>

★それぞれＣＳＳの設定しているデザイン環境が違うため、各ピクセルには
注意が必要
下記を参考にして下さい
http://ameblo.jp/new-bulue9/