ユーティリティ

2019年12月

1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31 - - - -

キーワード検索

キーワード検索フォーム
キーワード

ユーザー

  • cccのアバター

新着画像

過去ログ

ブログパーツ

Twitter

Twilogを見る

Feed

エントリー

freoのメニューでカーソルを近づけると背景色が変わるようにする

css/default.css のメニュー部分を以下のとおりに変更します。

div#menu {
  display: inline-block;
  background-color: #666666;
}
div#menu h2 {
  display: none;
}
div#menu ul, div#menu ul li, div#menu a {
  display: block;
  margin: 0;
  padding: 0;
}
div#menu ul li {
  float: left;
  list-style: none;
  white-space: nowrap;
}
div#menu a:link, div#menu a:visited {
  color: #FFFFFF;
  text-decoration: none;
  background: transparent;
  padding: 4px 10px;
}
div#menu a:active, div#menu a:hover {
  color: #FFFFFF;
  background-color: #008B45;
}
div#menu:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
/* Hides from IE-mac ¥*/
 * html div#menu {height: 1%}
        div#menu {display: block;}
/* End hide from IE-mac */

これでメニューの各項目にカーソルを近づけると項目の背景色が緑色に変わります。
背景色を変更したい場合は上記の太字部分(#008B45)のところを適宜変更してください。

ページ移動

関連エントリー

コメント

tim

上記の css/common.css は css/default.css の間違いではないでしょうか。

  • 2012/10/24 01:45:00

ccc

そのようですね(^^ゞ
修正しておきます。ご報告ありがとうございましたm(__)m

  • URL
  • 2012/10/25 18:36:00

コメント登録

  • コメントを入力してください。
  • 一旦登録したコメントは、あとで編集できませんのでご注意下さい。
登録フォーム
名前
メールアドレス
URL
コメント(コメント本文の装飾について
閲覧制限
※基本的には「全体に公開」されますが、内容によっては管理人の方で公開を制限する場合がございますので、その旨ご了承下さい。
freoをカタカナ3文字で入力してください(スパム対策)