はてなブログにグローバルナビをつけよう!
こんばんわ!ゆうこりんしゃちょーです。
はてなブログにメニューをつけるやり方を、超簡単にコピペでやっちゃいましょう 😎
①赤枠で囲った、右上の▼のところを押して、ウインドウを出す。
②青枠で囲った「デザイン」を選択。

③赤枠で囲った「カスタマイズ」を選択
④青枠で囲った「ヘッダー」を選択。


1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
<div id="menubar"> <ul> <li><a href="https://wakuwaku-investigation.hatenablog.com/" title="戻ってきてね(*^。^*)" target="_blank">HOME </a></li> <li><a href="https://deploy-brothers.com/" title="デプロイブラザーズ" target="_blank">IT豆知識ブログ <li><a href=http://ningen-kankei110.info/" title="人間関係110番" target="_blank">説教系ブログ <li><a href="http://リンク先URL/" title="ストーカーは犯罪です" target="_blank">CONTACT </a></li> </ul> </div> |
②には、下記のCSSを入れてください。色を変えたいときはカラーコードを変えてね。

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
#menubar{ width:100%; } #menubar ul{ display:table; width:100%; margin: 0; padding: 0; background-color: #FF989E; } #menubar li{ display: table-cell; width:25%; padding:0; background-color: #FF989E; } #menubar li a{ display: block; margin:0 auto; padding:5px; border: 1px solid #FFFFFF; text-decoration: none; color: #FFFFFF; text-align: center; font-size: 18px; } #menubar li a:hover{ background-color: ##FF989E; } |
ABOUT ME