2

重複の可能性:
チェックボックスのサイズ

最近のほとんどのブラウザー (FF10、Chrome、IE9+) でいくつかのチェックボックスを大きく表示しようとしています。

幅/高さを設定しようとしましたが、それは FF でのみ機能し、Chrome や IE では機能しません。

助言がありますか?

4

3 に答える 3

4

transform関数でスタイルを使用できますscalehttp://jsfiddle.net/kwEK6/を参照してください

これは多くのブラウザで機能しますが、もちろん、すべてではありません...

于 2012-04-25T14:14:26.440 に答える
0

次のようなことができます。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
  <style> 
    .ccs3fl input[type='checkbox'],.ccs3fl input[type='radio'] 
     { 
                filter: alpha(opacity=0); 
                -moz-opacity: 0; 
                -webkit-opacity: 0; 
                opacity: 0; 
                position:absolute; 
                cursor: hand; 
                cursor: pointer; 
     } 
    .ccs3fl input[type='checkbox']+::after,.ccs3fl input[type='radio']+::after 
     { 
                font-wight:bold; 
                border: solid 1px #D9D9D9; 
                border-radius: 3px; 
                vertical-align: middle; 
                content:'\2714'; 
                color:#FFFFFF; 
                background:#FFFFFF; 
     } 
    .ccs3fl input[type='checkbox']:checked+::after ,.ccs3fl input[type='radio']:checked+::after {color:#6599FF;} 
    .ccs3fl input[type='radio']+::after {content:'\25CF';padding:0 3px;} 
    </style></head><body> 

    <form class='ccs3fl'> 
    <input type=checkbox><b></b> My Custom Checkbox
    </form></body></html>

知らせ:

<b></b>

チェックボックスの最後 - これが適切に機能するためには、各ラジオ/チェックボックスの後に空の要素を配置する必要があります

于 2012-09-04T19:41:22.533 に答える
0

または、次を試すことができます。

height: 30px; 
line-height: 30px; //line-height is same with height make your text is middle.
font-size: 13px; // It's up to you
padding: 10px; // It's up to you
于 2012-04-25T14:48:10.740 に答える