« 関連性のあるエントリーを一覧表示 | メイン | 同一カテゴリー内でエントリーの移動(MT3.2) »

Ramdom Entry Pickup

マウスオン時にテキストをずらす


[PR] 「ページランク6サービス」SEOのための上質リンクを激安でご提供!

Category : [ CSS ]
November 18, 2005 18:39
TAG : [小粋空間]





このブログの左上のバナー文字「Project Multiburst」ですが、
文字の上にマウスカーソルを持ってくると、右下にずれます。


これは、スタイルシートで実現しています。


スタイルシートのずらしたい部分に以下を挿入します。

position:relative; top:1px; left:1px;

これだけです(^^;)


実際はというと、リンク文字の場合が多いと思いますので、以下のようになります。

#banner a {    padding-left:115px; } #banner a:link, #banner a:visited {    font-family: Century Gothic, Verdana, Arial, sans-serif;    color: #ffffff;    font-size: 32px;    text-decoration: none;    font-weight: normal; } #banner a:hover {    color: #ffff00;    position:relative;    top:1px; left:1px; } #banner a:active {    position:relative;    top:1px; left:1px; }


スタイルシートサンプルブック
大藤 幹
ソシム (2004/08)
売り上げランキング: 9,781
おすすめ度の平均: 4.71
5 初心者でもわかりやすい。
5 使いやすさ重視
4 CSSが分かる!



ソーシャルブックマーク

「del.icio.us」にブックマーク|このエントリーの「del.icio.us」での登録状況|はてなブックマーク|はてなブックマーク|テクノラティ・リンク検索結果|Technorati|BlogPeople Instant Bookmark|BlogPeople Tags|ドリコムRSS|ニフティクリップ|livedoorクリップ|livedoorクリップ|ECナビに登録|add-fc2.gif|FC2ブックマークでの登録状況

このエントリーと関連性が高いと思われるエントリー


このエントリーに関連するかもしれない商品


おすすめ商品


Link Information

Link HTML:

トラックバックURL:

Trackbacks

» カーソルのカスタマイズ from ブログリサーチ

CSSでマウスのカーソルの形を変更する事が出来ます。 以下の文字の上にカーソルを移動すると形が変わります。 試してみてください。 auto defaul... [Read More]

コメントする