故事: 最近,我问了一个关于在按钮上获得“增长”效果的问题(就像吊饰一样工作),然后我被要求对重力表单提交按钮应用相同的效果,但我似乎无济于事。我什至渴望“!重要”的一切。
问题: 您能帮我理解为什么我在重力形式之外的按钮上应用相同的CSS似乎可以工作,但在重力形式内部的按钮上却没有用吗?
外观如何: 找到下面的链接,查看应用以下CSS后需要按钮如何显示(仅“正在增长”的效果)。
Rounding background image of button
body .gform_wrapper .gform_footer input[type=submit] {
color: #000;
background: #fdc900;
}
body .gform_wrapper .gform_footer input[type=submit] {
z-index:99 !important;
text-decoration:none !important;
transition:color 1s !important;
position: relative !important;
display: inline-block !important;
padding: 15px 70px !important;
border: 1px solid #fdc900 !important;
border-radius:50px !important;
position:relative !important;
}
body .gform_wrapper .gform_footer input[type=submit]:hover:after{
width:100% !important;
}
body .gform_wrapper .gform_footer input[type=submit]:hover{
color:red !important;
}
body .gform_wrapper .gform_footer input[type=submit]:after{
width:0% !important;
transition: width 1s !important;
height:100% !important;
z-index:-1 !important;
content:"" !important;
position:absolute !important;
border-radius:50px !important;
top:0 !important;
left:50% !important;
transform:translateX(-50%) !important;
background-image: linear-gradient(#fdc100, #fdc100) !important;
}
<input type="submit" id="gform_submit_button_2" class="gform_button buttonCustom-Button" value="GET QUALIFIED NOW" tabindex="59" onclick="if(window["gf_submitting_2"]){return false;} window["gf_submitting_2"]=true; " onkeypress="if( event.keyCode == 13 ){ if(window["gf_submitting_2"]){return false;} window["gf_submitting_2"]=true; jQuery("#gform_2").trigger("submit",[true]); }">