CSS ユーザーナビエリア

2008/12/16

またまたアメブロの勝手な変更により

http://ameblo.jp/exlink/entry-10178945284.html

こちらをどうぞ

アメブロ側の変更により

ユーザーナビエリアがブログ上部に現れて消し方等の質問が増えてきました・・・・

消し方は去年の１１月の記事のままですが文字の色等の変更方法も含めて再度アップします・・・

↓何もしない場合

↓消しちゃいます

/*ナビゲーションリンク消す*/
div#userNaviArea{
display: none;
}

↓スキマはそのままで消しちゃいます

/*ナビゲーションリンク消す*/
div#userNaviArea{
visibility: hidden;
}

↓ニックネームの文字色、サイズ変更

/*ユーザーナビ　ニックネーム*/
div#userNaviArea a#userNickName{
color:#ff0099 !important;/*文字色*/
font-size: 15px !important;/*文字サイズ*/
padding-top:0px !important;/*上の位置調整*/
}

※サイズを小さくした場合上にずれてしまうのでpadding-topに数字を入れて横と位置を合わせます

↓ナビゲーションの文字色、サイズ変更

/*ユーザーナビ　ナビゲーション*/
#userNaviArea ul#navigationList,
#userNaviArea ul#navigationList a{
color:#ff0099;/*文字色*/
font-size:15px;/*文字サイズ*/
padding-top:0px;/*上の位置調整*/
}

↓ナビゲーション上のスキマを変更

/*ユーザーナビエリア*/
div#userNaviArea{
padding-top:15px !important;
}

↓仕切り線の色を変更します　　｜→｜

/*ユーザーナビ　仕切り*/
ul#navigationList li{
border-right:#ff0099 !important;
}

↓仕切り線を二重線に変更します　　 double

/*ユーザーナビ　仕切り*/
ul#navigationList li{
border-right:3px double #ff0099 !important;
}

　　　　　　　※太さを3px以上にしないと二重線にはなりません

↓仕切り線を破線に変更します　dashed

/*ユーザーナビ　仕切り*/
ul#navigationList li{
border-right:3px dashed #ff0099 !important;
}

↓仕切り線を点線に変更します　dotted

/*ユーザーナビ　仕切り*/
ul#navigationList li{
border-right:3px dotted #ff0099 !important;
}

　　　　　　　　※太さを2px以上にしないと　点線に見えません

↓マウスがのったときの文字色を変更

#userNaviArea ul#navigationList a:hover{
color:#0000ff;
}