はてなダイアリーのテンプレートをカスタマイズする。
すこしテンプレートに飽きてきたのと、リンクの灰色が目に悪そうな気がしてきたのでCSSを編集します。
本当は外部CSSを読み込ませたいのですが、実装されていないので、与えられたインタフェースから編集します。
http://i.hatena.ne.jp/idea/3770
久しくスタイルシートなどいじっていないので、勉強がてら。
やりたいこと一覧
- リンクの色を淡い青に
- ヘッダーにメニューの表示
編集項目
スタイルシートの編集
/* まだ見ていないリンク */ a:link { color: #5555ff } /* すでに見たリンク */ a:visited { color: #bb55bb; text-decoration: none } /* はてなキーワードは黒のまま */ a.keyword { color: black; text-decoration: none; border: none; } /* タイトルも黒のままにしたいがうまくいかない… */ h1 { font-color:#000000; } /* メニュー表示用 */ table{ width: 100% } td,td{ border: 2px #cccccc solid; }
Google Absenseの広告の色も変えてやろうと、思ったがうまくいかなかった。
一応 LC:0000FFというのがLink Colorだと思って変更してみたのだが、デフォルトの真っ青のまんま。
反映に時間がかかるのかな??
ヘッダの編集
こんなん使ってメニューを作ろうと思ったんだけど、いまいちセンスが光らんのでまた後日
<table> <tr> <td>about me</td> <td>about this blog</td> <td>archive</td> </tr> </table>
リンク集
- はてなダイアリーTipsスタイルシートでデザイン編
- CSS Tips for はてなダイアリー(HTML構造1)
- HTML構造2
- 参考になりそうなはてなエントリ
- スタイルシートサンプル集
- chepookaさんがまとめたリンク集:これだけ見てれば何とかなりそうだ
- http://d.hatena.ne.jp/keyword/%a4%cf%a4%c6%a4%ca%a5%c0%a5%a4%a5%a2%a5%ea%a1%bc%a5%ac%a5%a4%a5%c9%a1%d6CSS%a5%bb%a5%ec%a5%af%a5%bf%a1%d7:CSSセレクタについて:簡単な例付き
- http://d.hatena.ne.jp/keyword/%a4%cf%a4%c6%a4%ca%a5%c0%a5%a4%a5%a2%a5%ea%a1%bc%a5%ac%a5%a4%a5%c9%cc%dc%bc%a1?kid=13358#apply:はてなガイド