Recaptcha固定圖像尺寸

爲什麼recaptcha圖像的尺寸固定爲300x57？即使在定製注入圖像的div時，div的寬度和高度也會被覆蓋並設置爲300x57。當然，圖像可以在渲染後重新調整大小，但爲什麼沒有選項可以生成開發人員希望的大小的圖像。Recaptcha固定圖像尺寸

http://code.google.com/apis/recaptcha/docs/customization.html

驗證碼將依靠與下列ID的HTML元素的存在，以顯示CAPTCHA給用戶：一個空div與ID recaptcha_image。這是實際圖像的放置位置。那麼div會是300x57像素

謝謝

來源

2010-08-02 ken

#recaptcha_image img { 
    width: 200px !important; 
    height: 38px !important; 
}

來源

2011-04-20 22:07:16

您可以覆蓋內嵌的CSS加入！CSS規則背後重要的是，即使在外部文件中。

來源

2010-10-10 22:23:04 MatTheCat

與CSS完全定製，demo

<form method="POST" action=""> 



<script type="text/javascript"> 
           var RecaptchaOptions = { 
            tabindex: 1, 
            theme: 'custom', 
            custom_theme_widget: 'recaptcha_widget' 
           }; 
          </script> 
          <div id="recaptcha_widget" style="display:none"><div id="recaptcha_image"></div> 
           <div class="recaptcha_only_if_incorrect_sol" style="color:red">Incorrect, please try again</div> 
           <span class="recaptcha_only_if_image">Enter the words above:</span> 
           <span class="recaptcha_only_if_audio">Type what you hear:</span> 
           <input type="text" id="recaptcha_response_field" name="recaptcha_response_field"> 
           <div class="get_another_captcha"><a href="javascript:Recaptcha.reload()">Get another CAPTCHA</a></div> 
           <div class="recaptcha_only_if_image"><a href="javascript:Recaptcha.switch_type(&#39;audio&#39;)">Get an audio CAPTCHA</a></div> 
           <div class="recaptcha_only_if_audio"><a href="javascript:Recaptcha.switch_type(&#39;image&#39;)">Get an image CAPTCHA</a></div> 
           <div><a href="javascript:Recaptcha.showhelp()">Help</a></div> 
           <script type="text/javascript" src="http://www.google.com/recaptcha/api/challenge?k=YourAPI"></script> 
           <noscript><iframe src="http://www.google.com/recaptcha/api/noscript?k=YourAPI" height="300" width="500" frameborder="0"></iframe><br> 
           <textarea name="recaptcha_challenge_field" rows="3" cols="40"> 
           </textarea> 
           <input type="hidden" name="recaptcha_response_field" value="manual_challenge"></noscript></div> 
          <script type="text/javascript"> 
           window.onload = function() { 
            Recaptcha.focus_response_field(); 
           } 
          </script> 
          <table cellspacing="0" cellpadding="4" border="0" style="font-family: Helvetica, sans-serif; color: #000000; font-size: 12px;"><tr><td><div><input type="submit" name="Button1" value="Submit"></div></td></tr></table></form>

來源

2014-02-12 17:23:50 Developer

這爲我工作，有效地改變了整個控制的寬度，不僅內部圖像

#recaptcha_area 
    { 
     width: 250px !important; 
     height: 38px !important; 
    }

來源

2014-10-23 11:30:03 msoliman

解決方案的新工作google Recaptcha（https://www.google.com/recaptcha/）

<!--adjust to your needs --> 
<div class="g-recaptcha" data-sitekey="your_sitekey" style="transform:scale(.8); margin:0 -30px">

來源

2015-02-23 14:55:26

對於noCaptcha的Recaptcha的新版本，我以下工作：

<div class="g-recaptcha" data-theme="light" data-sitekey="XXXXXXXXXXXXX"  
style="transform:scale(0.77);transform-origin:0;-webkit-transform:scale(0.77); 
transform:scale(0.77);-webkit-transform-origin:0;transform-origin:0 0;"></div>

如果你只比例仍然需要在div的原始大小。但上面的解決方案解決了空白問題。

Ref

來源

2015-08-21 03:18:05 Muntasim

Recaptcha固定圖像尺寸

回答

相關問題