我安装了
Google Recaptcha 在一个网站(不是wordpress网站或Joomla)所以不提供任何WP插件或Joomla扩展:)
我的问题是,网站是响应和recaptcha不是.当我使用Firebug找到它的样式,我意识到不仅Google提供的库不包含css文件,我不能在我的custom-styles.css文件中覆盖它们,因为Google非常周到地应用了!选择器在他们的CSS中破解了一切,但我甚至尝试对它进行分类,以便我可以做出违约,并希望覆盖Google的风格,但是插件不工作:(
有任何想法吗?
附:我也没有使用不同的重新验证码.抱歉.我确定这里有一些recaptcha怪胎;)
这是HTML.这是recaptcha.PHP从服务器呈现的内容.这不是我在实际的PHP页面…(没有一个CSS,这是主要的问题)
<div id="recaptcha_widget_div" style="" class=" recaptcha_nothad_incorrect_sol recaptcha_isnot_showing_audio"><div id="recaptcha_area"><table id="recaptcha_table" class="recaptchatable recaptcha_theme_red"> <tbody> <tr> <td colspan="6" class="recaptcha_r1_c1"></td> </tr> <tr> <td class="recaptcha_r2_c1"></td> <td colspan="4" class="recaptcha_image_cell"> <center><div id="recaptcha_image" style="width: 300px; height: 57px;"> <img id="recaptcha_challenge_image" alt="reCAPTCHA challenge image" height="57" width="300" src="http://www.google.com/recaptcha/api/image?c=03AHJ_VutTaFjCI-gV3f3W2_M6gix7arVpF-9EOz-f773U5LmDrl33mKCn9wMXYGe0t8-xy-1HD0ysHzOI_NYyOtxOxD_a4Jj5G5h4bDMalKBQ5PDJaaE6ur8K44ilzimisHHYX6xZJ4y9xeuP6lT4vQa59-nNPju3VrlolnYgbM6oKgD7el1Rr9cpbRojjc_2zFraHkTjxyUU"></div> </center> </td> <td class="recaptcha_r2_c2"></td> </tr> <tr> <td rowspan="6" class="recaptcha_r3_c1"></td> <td colspan="4" class="recaptcha_r3_c2"></td> <td rowspan="6" class="recaptcha_r3_c3"></td> </tr> <tr> <td rowspan="3" class="recaptcha_r4_c1" height="49"> <div class="recaptcha_input_area"> <span id="recaptcha_challenge_field_holder" style="display: none;"> <input type="hidden" name="recaptcha_challenge_field" id="recaptcha_challenge_field" value="03AHJ_VutTaFjCI-gV3f3W2_M6gix7arVpF-9EOz-f773U5LmDrl33mKCn9wMXYGe0t8-xy-1HD0ysHzOI_NYyOtxOxD_a4Jj5G5h4bDMalKBQ5PDJaaE6ur8K44ilzimisHHYX6xZJ4y9xeuP6lT4vQa59-nNPju3VrlolnYgbM6oKgD7el1Rr9cpbRojjc_2zFraHkTjxyUU"></span> <input name="recaptcha_response_field" id="recaptcha_response_field" type="text" autocorrect="off" autocapitalize="off" placeholder="Type the text" autocomplete="off" style="font-style: italic;"> <span id="recaptcha_privacy" class="recaptcha_only_if_privacy"><a href="http://www.google.com/intl/en/policies/" target="_blank">Privacy & Terms</a></span> </div> </td> <td rowspan="4" class="recaptcha_r4_c2"></td> <td><a id="recaptcha_reload_btn" title="Get a new challenge"> <img id="recaptcha_reload" width="25" height="17" src="http://www.google.com/recaptcha/api/img/red/refresh.gif" alt="Get a new challenge"></a></td> <td rowspan="4" class="recaptcha_r4_c4"></td> </tr> <tr> <td><a id="recaptcha_switch_audio_btn" class="recaptcha_only_if_image" title="Get an audio challenge"> <img id="recaptcha_switch_audio" width="25" height="16" alt="Get an audio challenge" src="http://www.google.com/recaptcha/api/img/red/audio.gif"></a><a id="recaptcha_switch_img_btn" class="recaptcha_only_if_audio" title="Get a visual challenge"> <img id="recaptcha_switch_img" width="25" height="16" alt="Get a visual challenge" src="http://www.google.com/recaptcha/api/img/red/text.gif"></a> </td> </tr> <tr> <td><a id="recaptcha_whatsthis_btn" title="Help"> <img id="recaptcha_whatsthis" width="25" height="16" src="http://www.google.com/recaptcha/api/img/red/help.gif" alt="Help"></a> </td> </tr> <tr> <td class="recaptcha_r7_c1"></td> <td class="recaptcha_r8_c1"></td> </tr> </tbody> </table> </div> </div>
这是我在页面上所做的
require_once('recaptchalib.PHP'); $publickey = "your_public_key"; // you got this from the signup page echo recaptcha_get_html($publickey);
这是我的问题
更改了自动高度和媒体查询
@media only screen and (max-width : 480px) { #recaptcha_challenge_image{ margin: 0 !important; width: 100% !important; height: auto !important; } #recaptcha_response_field { margin: 0 !important; width: 100% !important; height: auto !important; } .recaptchatable #recaptcha_image { margin: 0 !important; width: 100% !important; height: auto !important; } .recaptchatable .recaptcha_r1_c1,.recaptchatable .recaptcha_r3_c1,.recaptchatable .recaptcha_r3_c2,.recaptchatable .recaptcha_r7_c1,.recaptchatable .recaptcha_r8_c1,.recaptchatable .recaptcha_r3_c3,.recaptchatable .recaptcha_r2_c1,.recaptchatable .recaptcha_r4_c1,.recaptchatable .recaptcha_r4_c2,.recaptchatable .recaptcha_r4_c4,.recaptchatable .recaptcha_image_cell { margin: 0 !important; width: 100% !important; background: none !important; height: auto !important; } }