Html 具有下拉列表作为组加载项的文本框

我正在尝试将下拉列表用作引导中的组加载项：

<div class="col-md-5">
  <div class="form-group">
    <div class="input-group">
      <div class="input-group-addon">@Html.DropDownListFor(m => m.SelectedCountryCode, new SelectList(Model.ListOfCountries, "PhoneCode", "PhoneCode"), "Select")</div>
      @Html.TextBoxFor(m => Model.Value, new { @class = "form-control" })
    </div>
  </div>
</div>

@DropDownListFor（m=>m.SelectedCountryCode，new SelectList（Model.ListOfCountries，“PhoneCode”，“PhoneCode”），“Select”）
@Html.TextBoxFor（m=>Model.Value，新的{@class=“form control”}）

这是我得到的结果：

有没有其他方法可以使我的下拉列表样式与文本框相同

我不想在下拉列表中出现灰色部分

下面是一个JSFIDLE：

---

您可以使用

输入组btn

下拉列表：

  <div class="input-group-btn">
    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"
        aria-expanded="false">Select <span class="caret"></span></button>
    <ul class="dropdown-menu" role="menu">
      <li><a href="#">0044</a></li>
      <li><a href="#">0033</a></li>
      <li><a href="#">001</a></li>
    </ul>
  </div><!-- /btn-group -->

---

如何设置选择框的样式

select{
background-color: transparent;
}

可能是我把你的问题搞错了：）

---

然后这个区域就消失在我的手机上了。我正在iOS 8上使用safari。

您还可以覆盖该类的背景色：

.input-group-addon {
    background: white;
}

---

或者只是在现有CSS中更改它。

这是修复此问题的最佳方法。使用以下内容设置下拉列表的样式：

background: transparent; 
border: 0;

然后它会像这样：

打开时：

---

当我使用view CSS时，“input group addon”的背景色似乎设置为灰色。我认为这不会从表单中发回所选的下拉列表值，不会。您可以保留隐藏的输入，并在下拉列表的值更改时更改其值。否则，您可以简单地。

background: transparent; 
border: 0;