Wordpress 联系表 7 下拉菜单样式问题

Question

我的 Wordpress 主题使用深色背景，我的联系页面上的一切都很好，除非我在联系表单 7 中使用下拉菜单。然后只有那个框出现样式问题。

http://www.unaneary.co.uk/?page_id=23

在联系表格 7 面板中，这是我的代码行：-

如果您的询问是具体的，请从列表中选择
[select menu-672 "Photoshop" "Web Content Editing" "General Typing or Admin" "IT" "Ebay Trading"]

所以我的猜测是，我需要在 style.css

中添加一些额外的编码

这可能真的很简单，但我是联系表格的新手，有人告诉我使用联系表格 7，这真的很简单所以，我一定有一个 'bad coding day'

非常感谢您的帮助，因为我现在已经花了几个小时挠头解决这个问题，即向 style.css 添加不同的代码行，但是下拉框仍然显示那个浅灰色的框:(

这是表单部分的样式。表格

    fieldset {
    border: none;
}
form {
    background: #22211f;
    padding: 20px;
}
form ul {
    list-style: none;
}
form ul li {
    padding-bottom: 10px;
}
form.contact {
    width: 550px;
}
label {
    text-transform: uppercase;
    color: #999;
    font-size: 12px;
}
input[type="text"],  input[type="email"],  input[type="tel"],  input[type="url"],  input[type="file"],  textarea {
    background: #3c3a39 url(images/bg-input.png);
    border: 1px solid #252321;
    -webkit-box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.1);
    -moz-box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.1);
    box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.1);
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    font-size: 14px !important;
    width: 220px;
    padding: 7px !important;
}
input[type="submit"] {
    color: #fff;
    background: url(images/bg-button-gold.png);
    padding: 7px 18px 7px;
    display: inline-block;
    margin-top: 10px;
    margin-right: 15px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    cursor: pointer;
    text-transform: uppercase;
    font-size: 14px;
    border: none;
}
input:focus, textarea:focus {
    background: #3c3a39 url(images/bg-input-ro.png);
}
textarea {
    width: 480px;
    height: 150px;
    padding: 7px !important;
    font-size: 14px !important;
}
#submit-comment {
    float: right;
}

Answer 1

您只需为表单的 select 下拉列表添加一些样式规则。上述 css 规则的 None 将以表单的 select 元素为目标。

关于此的大量文章：

http://css-tricks.com/dropdown-default-styling/

http://bavotasan.com/2011/style-select-box-using-only-css/

只需添加联系表 7 class 这样：

.wpcf7-form select {
    rules here
}

Wordpress 联系表 7 下拉菜单样式问题

Wordpress contact form 7 drop down menu styling issue

css

forms

wordpress