Asp.net DropDownList 自定义样式(想怎么改就怎么改!)

最近在做一个asp.net的项目,需要对默认的dropdownlist样式进行美化,固有的dropdownlist的小箭头实在让人无法接受,于是开始在百度,google 上下求索,天不负有心人,终于找到了一个完美解决方案(经过google搜素所得),各位客官可以到这个地址

Custom Checkboxes, Custom Radio Buttons, Custom Select Lists

详细参考一下 核心js文件

custom-form-elements.min.js然后在要改变样式的dropdownlist上添加一个名为“”styled"的class 需要在页面上添加一个样式,如下

.select {
position: absolute;
width: 158px;
height: 21px;
padding: 0 24px 0 8px;
color: #fff;
font: 12px/21px arial,sans-serif;
background: url(select.png) no-repeat;/*span背景图片,其实就是dropdownlist图片*/
overflow: hidden;
}

其实对该解决方案分析所得,这个方法非常巧妙,真正的dropdownlist进行了透明化,实际显示的是一个span标签,span的背景图片就是实际看到的dropdownlist的美化结果,如果dropdownlist有后台事件的,需要
在这个custom-form-elements.min.js 中的choose函数的末尾添加

setTimeout('__doPostBack(\'' + this.id + '\',\'\')', 0);

this.id  ----指当前操作的dropdownlist 的Id

如果有什么不解的,可以提出.

posted @ 2013-11-18 15:51  阿磊ing  阅读(11686)  评论(22编辑  收藏  举报