重力表单提交按钮CSS效果不适用

时间:2019-05-31 00:20:49

标签: html css gravityforms

故事: 最近,我问了一个关于在按钮上获得“增长”效果的问题(就像吊饰一样工作),然后我被要求对重力表单提交按钮应用相同的效果,但我似乎无济于事。我什至渴望“!重要”的一切。

问题: 您能帮我理解为什么我在重力形式之外的按钮上应用相同的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[&quot;gf_submitting_2&quot;]){return false;}  window[&quot;gf_submitting_2&quot;]=true;  " onkeypress="if( event.keyCode == 13 ){ if(window[&quot;gf_submitting_2&quot;]){return false;} window[&quot;gf_submitting_2&quot;]=true;  jQuery(&quot;#gform_2&quot;).trigger(&quot;submit&quot;,[true]); }">

0 个答案:

没有答案