2

CSS3 を使用してチェックボックスのスタイルを設定しましたが、これは機能しています (チェックボックスを非表示にし、その上にラベルを配置/スタイル設定することにより)。これで、チェックボックスに使用したい CSS3 で作成されたアイコンがいくつか見つかりました。チェックボックスは CSS3 を使用してスタイル設定されているため、CSS3 で作成されたチェックボックスのアイコンを使用するのは簡単だと思います。

うーん...簡単だと思ったのですが、うまくいきません。

CSS3で作成したアイコンはサウンドアイコンです。「サウンドオン」の 1 つと「サウンドオフ」の 1 つ。ここで、チェックボックスがオンの場合は「サウンドオン」アイコンを使用し、チェックボックスがオフの場合は「サウンドオフ」アイコンを使用したいと考えています。

私のフィドルを見てください:http://jsfiddle.net/mauricederegt/TRtvx/

これは私が試したことです:

基本的にスタイルinput:checked + label:beforeを持っている必要があります。.volume-on:beforeこれは機能し、ボタン div に「音波」が表示されました。残念ながら、アイコンの残りの部分 (コーン) が見えなくなりました。

私が望むことは可能ですか?そして、これをどのように達成するのですか?

敬具、

4

1 に答える 1

0

CSS スプライトを使用してこれを実現できます。基本的には、1 つの画像の異なる部分を 2 つの画像として表示します。このすばらしいチュートリアルをチェックしてください: http://css-tricks.com/css-sprites/

于 2012-05-10T17:22:32.923 に答える