如何使选择下拉与圆形边框？ [英] how to make select dropdown with rounded border?

问题描述

我使用选择标记下拉菜单，使用css我做的选择框为圆角，通过做这个下拉菜单保持正方形，我也想转动这个圆角。

i am using select tag for dropdown menu, using css i made select box to be rounded corner, by doing this drop down menu remains square, i also want to turn that rounded corner.

这里是现场演示

http://jsfiddle.net/ankurdhanuka/AwUHn/1/

HTML

<p class="formRight">
<span style="padding-right:100px">Lead Type: </span>

    <select id="leadType" class="box2" name="lead_type">
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
    </select>
</p>

CSS

.formRight select {
    background: none repeat scroll 0 0 #FFFFFF;
    border: 1px solid #E5E5E5;
    border-radius: 5px 5px 5px 5px;
    box-shadow: 0 0 10px #E8E8E8 inset;
    height: 40px;
    margin: 0 0 0 25px;
    padding: 10px;
    width: 110px;
}

您的帮助将不胜感激。提前感谢。

Your Help will be appreciated. Thanks in advance.

推荐答案

这是我的解决方案。

strong> CSS

CSS

.selectBox{border-radius:4px;border:1px solid #AAAAAA;}

HTML

<select class="selectBox">
.............
</select>

这篇关于如何使选择下拉与圆形边框？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！