asp.net - 使用 CSS 的平面下拉列表

Question

我正在使用下面的 css 代码在我的 aspx 页面中对 TextBox 和 DropDownList 进行平面化和样式化。样式正确应用于 TextBox 。但是 DropDownList 看起来并不平坦。看图片。

.txtDllBox
{
    border: 1px solid #ccc;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;         
    
}

我该如何解决这个问题？

Answer 1

您可以将您的内部select boxadiv并添加cssdiv如下：

div { 
    border:2px solid #ced6e9; 
    -moz-border-radius:8px; 
    border-radius: 8px;
    display: inline-block;
}

select {
    margin: 2px;
    border: none;
}

your html can be like this:

<div>
    <select>
        <option value="0">Select one...</option>
        <option values="1">1</option>
    </select>
</div>

Answer 2

不确定这是否可行，但我没有足够的代表发表评论，尝试也无妨。使用“！important”规则覆盖可能应用于下拉列表的任何其他样式。

.txtDllBox
{
    border:                1px solid #ccc  !important;
    border-radius:         4px             !important;
    -moz-border-radius:    4px             !important;
    -webkit-border-radius: 4px             !important;         
}

请注意，如果在某些时候需要从父控件继承这些样式中的任何一个，这可能会使您的 CSS 更难维护。