CSS3 を使用してチェックボックスのスタイルを設定しましたが、これは機能しています (チェックボックスを非表示にし、その上にラベルを配置/スタイル設定することにより)。これで、チェックボックスに使用したい CSS3 で作成されたアイコンがいくつか見つかりました。チェックボックスは CSS3 を使用してスタイル設定されているため、CSS3 で作成されたチェックボックスのアイコンを使用するのは簡単だと思います。
うーん...簡単だと思ったのですが、うまくいきません。
CSS3で作成したアイコンはサウンドアイコンです。「サウンドオン」の 1 つと「サウンドオフ」の 1 つ。ここで、チェックボックスがオンの場合は「サウンドオン」アイコンを使用し、チェックボックスがオフの場合は「サウンドオフ」アイコンを使用したいと考えています。
私のフィドルを見てください:http://jsfiddle.net/mauricederegt/TRtvx/
これは私が試したことです:
基本的にスタイルinput:checked + label:before
を持っている必要があります。.volume-on:before
これは機能し、ボタン div に「音波」が表示されました。残念ながら、アイコンの残りの部分 (コーン) が見えなくなりました。
私が望むことは可能ですか?そして、これをどのように達成するのですか?
敬具、