无法为 Wordpress 设置 Contact Form 7 样式
Unable to style Contact Form 7 for Wordpress
有问题的网站:https://loopcycle.io/contact-us/
我发现代码应该改变我的表单的外观,但它什么也没做,我完全困惑,看起来模板中的某些东西或 wordpress 本身正在阻止那些?
我添加的用于使输入框变白的代码:
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 textarea
{
background-color: #fff;
color: #000;
width: 50%;
}
并使“提交”按钮居中:
input.wpcf7-form-control.wpcf7-submit {
display: block;
margin: 0 auto;
}
表单代码为:
<div class="form-group" style="padding-bottom: 30px;">[radio contact-reason use_label_element default:1 "Curious about Loopcycle" "Demo for manufacturers" "Demo for end users" "Collaboration" "Careers & Internships" "Speaker request" "Press" "Other"]</div>
<div class="form-group">[text* your-name placeholder "Your Name (required)"]</div>
<div class="form-group">[email* your-email placeholder "Your Email (required)"]</div>
<div class="form-group">[text your-company placeholder "Your Company"]</div>
<div class="form-group">[text* your-subject placeholder "Subject (required)"]</div>
<div class="form-group">[textarea your-message placeholder "Your message"]</div>
<div class="submit-group">[submit class:eut-extra-round "Send your message"]</div>
我觉得我点击了所有可能的选项卡和面板,试图找出覆盖我的编辑的内容,但找不到任何东西。
试试这个 CSS。这将是工作
input.wpcf7-form-control.wpcf7-submit {
display: block !important;
margin: 0 auto !important;
}
.wpcf7 input[type="text"], .wpcf7 input[type="email"], .wpcf7 textarea {
background-color: #fff !important;
color: #000 !important;
width: 50% !important;
margin: 10px auto !important;
}
span.wpcf7-form-control.wpcf7-radio > span {
width: 50% !important;
margin: 0 auto !important;
}
有问题的网站:https://loopcycle.io/contact-us/
我发现代码应该改变我的表单的外观,但它什么也没做,我完全困惑,看起来模板中的某些东西或 wordpress 本身正在阻止那些?
我添加的用于使输入框变白的代码:
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 textarea
{
background-color: #fff;
color: #000;
width: 50%;
}
并使“提交”按钮居中:
input.wpcf7-form-control.wpcf7-submit {
display: block;
margin: 0 auto;
}
表单代码为:
<div class="form-group" style="padding-bottom: 30px;">[radio contact-reason use_label_element default:1 "Curious about Loopcycle" "Demo for manufacturers" "Demo for end users" "Collaboration" "Careers & Internships" "Speaker request" "Press" "Other"]</div>
<div class="form-group">[text* your-name placeholder "Your Name (required)"]</div>
<div class="form-group">[email* your-email placeholder "Your Email (required)"]</div>
<div class="form-group">[text your-company placeholder "Your Company"]</div>
<div class="form-group">[text* your-subject placeholder "Subject (required)"]</div>
<div class="form-group">[textarea your-message placeholder "Your message"]</div>
<div class="submit-group">[submit class:eut-extra-round "Send your message"]</div>
我觉得我点击了所有可能的选项卡和面板,试图找出覆盖我的编辑的内容,但找不到任何东西。
试试这个 CSS。这将是工作
input.wpcf7-form-control.wpcf7-submit {
display: block !important;
margin: 0 auto !important;
}
.wpcf7 input[type="text"], .wpcf7 input[type="email"], .wpcf7 textarea {
background-color: #fff !important;
color: #000 !important;
width: 50% !important;
margin: 10px auto !important;
}
span.wpcf7-form-control.wpcf7-radio > span {
width: 50% !important;
margin: 0 auto !important;
}