4

IE8 スクリーンショット (バグ): ここに画像の説明を入力

Google Chrome の「スクリーンショット」(どのように表示されるか): ここに画像の説明を入力

現在のチェックボックスは CSS3 を使用してスタイル設定されていますが、互換性を持たせる方法はありますか?

JSFiddle で行ったチェックボックスのスタイリングは CSS3 の技術の一部であるため、下位のブラウザーではその一部をレンダリングできません。IE Tester のフォームを確認してください (Windows を使用している場合は、IE の下位バージョンをダウンロードしてテストできます)。

http://www.fratelliristorante.com.au/contact.html

http://jsfiddle.net/E5CxM/2/

<p>
<label></label>
<input type="checkbox" id="checkbox" name="checkbox" class="regular-checkbox big-checkbox" value="Yes" checked="checked">
<label for="checkbox" style="margin-right:10px;"></label>Subscribe me to your mailing list for upcoming events, hot offers and deals
</p>

注: Dropkick (jQuery) も使用しました。これは、選択ボックスのみをスタイルし、チェックボックスをスタイルしません。

4

2 に答える 2

2

動かないのは古いIEが対応していないから:afterです。

非表示を使用してチェックマークを保持するように HTML を更新し<span>、可視性を切り替えるように CSS を調整しました。

更新されたフィドル

于 2013-04-02T00:30:38.307 に答える
0 
<!--[if IE]>
<link rel="stylesheet" type="text/css" href="all-ie-only.css" />
<![endif]-->

all-ie-only.css という名前の css ファイルを作成し、ライト バージョンを IE に入れます。同じものを使用して別のテキスト ボックスを作成できます。

于 2013-04-02T00:29:07.920 に答える