360UI

360UI 界面框架 最完美的select下拉框美化

六月ゝ 毕业季﹏ 提交于 2019-11-30 00:01:23
最完美的 select 下拉框美化 很多人为 select 的诸多不完善而头痛,如无法自定义样式、 IE6 中无法被浮动层遮住等等。下面介绍一款堪称最完美的下拉框组件: 360UI即QUI 下拉框( ) 特点 1 :美化的并且可自定义的外观 QUI 下拉框使用 JS 进行渲染。当页面引入了脚本和 CSS 后,页面中的下拉框都会变成如下外观: 该外观是由 CSS 和图片控制。通过修改 CSS 可以很方便地实现更改外观。 QUI 下拉框不存在 IE6 中无法被浮动层遮住等问题。 特点 2 :使用简单 QUI 下拉框代码写法与原来的写法一样,都是如下代码: < select > < option value = ""> 请选择功能 </ option > < option value = "1"> 新增图片 </ option > < option value = "2"> 维护图片 </ option > < option value = "3"> 新增新闻 </ option > </ select > 也可以动态创建 下拉框。 特点 3 :宽度处理 你是否遇到以下两种情况: ( 1 )不设置下拉框宽度,那么下拉框宽度默认为最宽的选项的宽度。当其选项过长时轻则会导致整个表单不整齐,重则会撑坏页面布局; ( 2 )设置下拉框宽度,但是由于下拉框的选项宽度有可能会很长