联系表格 7 插件提交按钮 [关闭]

Posted 2023-03-05

【中文标题】联系表格 7 插件提交按钮 [关闭]

【英文标题】：Contact Form 7 plugin submit button [closed]

【发布时间】：2018-10-03 05:59:33

【问题描述】：

我需要更改联系表单 7 的提交按钮样式。https://www.narwal.shop/contact-us/

更改背景颜色 添加边框半径 2 px 添加悬停白色背景颜色、黑色字体和黑色边框

通常我会找到源代码并编辑 CSS 文件，但这没有影响。你知道我必须编辑哪个文件吗？

Click here for example

【问题讨论】：

只需向您的提交按钮添加一个类并对其进行自定义 - contactform7.com/submit-button

你可以使用wordpress.org/plugins/contact-form-7-style这个插件来改变所有风格的联系表格7

【参考方案1】：

改变这个

input#cntctbttn 
    color: rgb(255, 255, 255);
    background-color: red;
    border-radius: 2px;

并将其添加到外观 -> 样式编辑器（style.css））

【参考方案2】：

#cntctbttn 的样式设置似乎覆盖了您的设置。只需在项目中搜索 #cntctbttn 并将其注释掉或删除即可。

【参考方案3】：

将此代码放入您的 css 文件中：

.wpcf7-submit:hover 
    color: black !important;
    background: white !important;
    border: 1px solid !important;

肯定会成功的。

【参考方案4】：

为提交按钮插入 id 然后使用下面的代码：

input#id 
border: 1px solid #000000;
background: #caf1ff;
color: #ffffff;
border-radius: 2px;


input#id:hover 
background: #ffffff;
color: #000000;