如何设置asp.net下拉列表的样式

发布时间：2020-12-15 22:33:13 所属栏目：asp.Net 来源：网络整理

导读：您可能会觉得这是一个重复的问题,但我有一个Asp：DropDownList,需要像下面的图片样式. 我浏览了谷歌和一些网站(在Stack中提到),但我无法得到预期的结果. 有人可以帮助我吗？提前致谢.. 解决方法请尝试以下代码 HTML asp:DropDownList ID="DropDownList1" r

您可能会觉得这是一个重复的问题,但我有一个Asp：DropDownList,需要像下面的图片样式.

我浏览了谷歌和一些网站(在Stack中提到),但我无法得到预期的结果.

有人可以帮助我吗？

提前致谢..

解决方法

请尝试以下代码

HTML

<asp:DropDownList ID="DropDownList1" runat="server" Width="120px" BackColor="#F6F1DB" ForeColor="#7d6754" Font-Names="Andalus" CssClass="ddl">
    <asp:ListItem Text="DEPART FROM"></asp:ListItem>
</asp:DropDownList>

CSS
编辑

<style type="text/css">
        .ddl
        {
            border:2px solid #7d6754;
            border-radius:5px;
            padding:3px;
            -webkit-appearance: none; 
            background-image:url('Images/Arrowhead-Down-01.png');
            background-position:88px;
            background-repeat:no-repeat;
            text-indent: 0.01px;/*In Firefox*/
            text-overflow: '';/*In Firefox*/
        }
</style>

检查我在Chrome中获得的屏幕截图,我还附上了下拉箭头图像(Arrowhead-Down-01.png).希望这可以帮到你.

截图

箭头向下-01.png

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!