经常遇到这样的问题,在使用bootstrap框架的时候select选择框的样式在火狐浏览器上继承的是浏览器本身的样式,跟谷歌等其他的浏览器样式对比很难看,并且很难调整,但是!

好东西来了,现在能调成跟谷歌一样的样式,只需要设置兼容火狐的样式即可:

  <link href="http://cdn.bootcss.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" rel="stylesheet">
<style>
@-moz-document url-prefix() {
select.form-control {
-moz-appearance: none;
appearance: none;
background-image: url("http://221.228.109.114:8083/manage/more/firefox_select_icon.png");
background-repeat: no-repeat;
background-position: calc(100% - 7px) 50%;
background-size: 2% auto;
border-radius:3px;
padding:0;
}
}
</style>

兼容火狐浏览器的select下拉框样式的更多相关文章

  1. select 下拉框样式修改 option文字居右

    select { direction: rtl; /*Chrome和Firefox里面的边框是不一样的,所以复写了一下*/ border: solid 1px #000; /*很关键:将默认的sele ...

  2. 改变 select下拉框 样式

    select{ outline: none; text-indent: 10px; height: 45px; line-height: 45px; width: 100%; border:1px s ...

  3. select下拉框美化

      其实用下列CSS就可以解决,原理是将浏览器默认的下拉框样式清除,然后应用上自己的,再附一张向右对齐小箭头的图片即可. select { /*Chrome和Firefox里面的边框是不一样的,所以复 ...

  4. firefox浏览器中 bootstrap 静态弹出框中select下拉框不能弹出(解决方案)

    问题出现场景1: 在firefox浏览器中在bootstrap弹出的modal静态框中再次弹出一个静态框时 select下拉框不能弹出选项 解决方案:去掉最外层静态框的 tabindex=" ...

  5. EF5+MVC4系列(7) 后台SelectListItem传值给前台显示Select下拉框;后台Action接收浏览器传值的4种方式; 后台Action向前台View视图传递数据的四种方式(ViewDate,TempDate,ViewBag,Model (实际是ViewDate.Model传值))

    一:后台使用SelectListItem 传值给前台显示Select下拉框 我们先来看数据库的订单表,里面有3条订单,他们的用户id对应了 UserInfo用户表的数据,现在我们要做的是添加一个Ord ...

  6. select下拉框选择触发事件

    我一直以来都认为,select 下拉框选择对选项 options 使用 onclick 注册事件即可,如下: <select> <option value="0" ...

  7. 基于jQuery select下拉框美化插件

    分享一款基于jQuery select下拉框美化插件.该插件适用浏览器:IE8.360.FireFox.Chrome.Safari.Opera.傲游.搜狗.世界之窗.效果图如下: 在线预览   源码下 ...

  8. 一款基于jQuery的联动Select下拉框

    今天我们要来分享一款很实用的jQuery插件,它是一个基于jQuery多级联动的省市地区Select下拉框,并且值得一提的是,这款联动下拉框是经过自定义美化过的,外观比浏览器自带的要漂亮许多.另外,这 ...

  9. jQuery制作简洁的多级联动Select下拉框

    今天我们要来分享一款很实用的jQuery插件,它是一个基于jQuery多级联动的省市地区Select下拉框,并且值得一提的是,这款联动下拉框是经过自定义美化过的,外观比浏览器自带的要漂亮许多.另外,这 ...

随机推荐

  1. js 将字符串当作js表达式执行方法

    听同事说了一个需求.他有一个数据对象obj,接口会给他返回一个索引key,这个key长度不固定,根据这个key去修改obj对应的值. 举个例子: let obj={"level1" ...

  2. 使用PaxScript为Delphi应用增加对脚本的支持

    通过使用PaxScript可以为Delphi应用增加对脚本的支持. PaxScript支持paxC,paxBasic,paxPascle,paxJavaScript(对ECMA-262做了扩展) 四种 ...

  3. AngularJS 指令实践指南(一)

    指令(Directives)是所有AngularJS应用最重要的部分.尽管AngularJS已经提供了非常丰富的指令,但还是经常需要创建应用特定的指令.这篇教程会为你讲述如何自定义指令,以及介绍如何在 ...

  4. windows系统使用

    1.访问局域网共享的文件,用 \\ip号 2.电脑的硬件名称(设备管理器中)是可以用软件修改的. 3.电脑中每一个连接网络的设备都有一个网卡地址(MAC地址),如无线网卡地址.有线网卡地址. 4.wi ...

  5. 天梯L3-003. 社交集群——并查集

    在社交网络平台注册时,用户通常会输入自己的兴趣爱好,以便找到和自己兴趣相投的朋友.有部分兴趣相同的人们就形成了“社交集群”.现请你编写程序,找出所有的集群. 输入格式: 输入的第一行给出正整数N(&l ...

  6. oracle主要的动态视图与基表的对应关系

    动态视图 基表 GV$ACCESS x$ksuses,x$kglob,x$kgldp,x$kgllk GV$ACTIVE_INSTANCES x$ksimsi GV$ACTIVE_SESS_POOL_ ...

  7. /etc/X11/xorg.conf

    # This configuration file was broken by system-config-keyboard Section "ServerLayout" Iden ...

  8. SpringBoot项目框架下ThreadPoolExecutor线程池+Queue缓冲队列实现高并发中进行下单业务

    主要是自己在项目中(中小型项目) 有支付下单业务(只是办理VIP,没有涉及到商品库存),目前用户量还没有上来,目前没有出现问题,但是想到如果用户量变大,下单并发量变大,可能会出现一系列的问题,趁着空闲 ...

  9. Devstack 配置文件说明手册

    本文为minxihou的翻译文章,转载请注明出处Bob Hou: http://blog.csdn.net/minxihou JmilkFan:minxihou的技术博文方向是 算法&Open ...

  10. 8.1 图像API

    8.1 图像API Routine Description Drawing related functions GUI_AddRect() 调整矩形框的大小 GUI_GetClientRect() R ...