Horozontal nav with CSS rollover

ロールオーバーは、ホバーに1つのイメージを使用します。それはクールだけど、私はそれを水平メニューで動作させる方法を知らない。私は何をしますか？私はあなたがCSSを探していると信じてい
おかげで、Horozontal nav with CSS rollover

<head> 
<style> 
/*CSS HOVER WITH ONE IMAGE*/ 
#emailUs{display: block;width: 107px;height: 23px;background: url("slide.jpg") no-repeat 0 0;} 
#emailUs:hover{background-position: 0 -23px;} 
#emailUs span{position: absolute;top: -999em;} 
</style> 
</head> 
<body> 
<!--Trying to get three buttons to go across 'same button as example'--> 
<a id="emailUs" href="#" title="Email Us"><span>Email Us</span></a> 
<a id="emailUs" href="#" title="Email Us"><span>Email Us</span></a> 
<a id="emailUs" href="#" title="Email Us"><span>Email Us</span></a> 
</body> 
</html> 
</html>

CSSスプライト
enter image description here

出典

2011-03-30 DisEngaged

： "フロート：左;"

リンクを「display：block;」に設定すると、自動的に次の行に移動します。つまり、左に浮かせると水平線に戻ります。

また、同じIDを持つ要素を複数持つことはできません。複数の要素に必要なものの代わりにクラスを使用します。

出典

2011-03-30 21:19:42 Dave

また、特定の番号を使用する代わりに、背景の位置を左上、次に左下に設定することもできます。ボタンのサイズを変更すると、将来的には簡単になります。 – Dave

"float"をあまり使用していない場合は、メニューの後に "clear：both;"と入力してdivなどを入力する必要があります。コード内の次のものがフローティングメニューの下に押し込まれないようにします。 – Dave

ありがとう、それは今とても簡単です。 – DisEngaged

Horozontal nav with CSS rollover

答えて

関連する問題