在我们用select的时候,通常因为他的默认样式比较丑而用自己样式,那首先要去掉他的默认样式

去掉select的边框和点击时的蓝色边框

select{border: none;outline: none;}

去掉select下拉的小三角

select{
appearance:none;
-moz-appearance:none;
-webkit-appearance:none;
} select::-ms-expand { display: none; }  /*清除ie的默认选择框样式清除,隐藏下拉箭头*/

所有浏览器都不支持appearance属性

Firefox支持替代的-moz-appearance属性

Safari和Chrome支持替代的-weblit-appearance属性

option的框是浏览器默认的,没有办法修改,想必你肯定试过option{border:0}和option{border:none}吧,没有效果

修改select的默认样式的更多相关文章

  1. ie,火狐,谷歌 select清除默认样式 设置新的样式

    select { border: solid 1px #000; /*Chrome和Firefox里面的边框是不一样的,所以复写了一下*/ appearance:none; -moz-appearan ...

  2. select框默认样式去除(ie中隐藏默认下拉图标)

    html代码 <select class="info-select"> <option selected="selected">1< ...

  3. 修改element ui 默认样式最好的解释

    KedAyAyA 17年10月 https://forum.vuejs.org/t/elementui/19171/5 首先添加了scoped的style标签会在vue-loader里进行处理 所谓的 ...

  4. react中修改antd的默认样式

    最近在做react+antd项目.不可避免的遇到了修改antd默认样式的问题. 比如,table组件的表头背景色设置,如果直接使用元素样式,会修改整个项目的table.这里我用的方法是,给table添 ...

  5. select去掉默认样式

    今天遇到的问题,并在这里做一下记录和总结 去除select下拉框默认样式 select { /*Chrome和Firefox里面的边框是不一样的,所以复写了一下*/ border: solid 1px ...

  6. 关于select的默认样式问题

    select { border: solid 1px #000; appearance:none; -moz-appearance:none; -webkit-appearance:none; pad ...

  7. css3修改浏览器scroll默认样式

    最近公司的新项目.前端样式采用的蚂蚁金服的antDesign. 比较喜欢antDesign.BootStrap一类简约大方的前端样式库. 但是在页面布局上.包括一些选择框.默认的scroll样式简直丑 ...

  8. 修改easyui panel 默认样式

    有这么个需求需要修改easyui panel头部中的背景色.于是根据panel中的最终被浏览器解析出来的类名,直接修改这个css样式,设置backgroud-color这个属性,发现不管用. 于是,就 ...

  9. css修改overflow滚动条默认样式

    html代码 <div class="inner"> <div class="innerbox"> <p style=" ...

随机推荐

  1. kafka学习(三)

    kafka 消费者-从kafka读取数据   消费者和消费者群里 kafka消费者从属于消费者群组.一个群组里的消费者订阅的是同一主题,每个消费者接受主题一部分分区的消息.如果我们往群组里添加更多的消 ...

  2. Spring Security Session Time Out

    最近在用Spring Security做登录管理,登陆成功后,页面长时间无操作,超过session的有效期后,再次点击页面操作,页面无反应,需重新登录后才可正常使用系统. 为了优化用户体验,使得在se ...

  3. 关于Logcat

    1 android logcat api Log.i(String tag, String msg) info,普通信息 Log.d(String tag, String msg) debug,调试信 ...

  4. c++primer chapter three

    3.1命名空间的using声明 using声明具有如下的形式:using namespace :: name; #include <iostream> using std :: cout; ...

  5. 本地代码推送到远程git仓库

    # 1. 在远程新建一个代码仓库(如码云,github..) # 2. 将本地代码提交 git init git add * git commit -am "first init" ...

  6. Could not locate executable null\bin\winutils.exe in the Hadoop binaries解决方式

    1.  问题: 2.  问题解决: 仔细查看报错是缺少winutils.exe程序. Hadoop都是运行在Linux系统下的,在windows下eclipse中运行mapreduce程序,要首先安装 ...

  7. mysqldump: [Warning] Using a password on the command line interface can be insecure.

    MySQL 5.6 警告信息 command line interface can be insecure 修复 在命令行输入密码,就会提示这些安全警告信息. Warning: Using a pas ...

  8. 04-Django-templates

    # 模板系统 - 模板:一组相同或者相似的页面,在需要个性化的地方进行留白,需要的时候只是用数据填充就可以使用 - 步骤: 1. 在settings中进行设置:TEMPLATES 2. 在tmeplt ...

  9. python学习笔记(2):科学计算及数据可视化入门

    一.NumPy 1.NumPy:Numberical Python 2.高性能科学计算和数据分析的基础包 3.ndarray,多维数组(矩阵),具有矢量运算的能力,快速.节省空间 (1)ndarray ...

  10. 利用WebSocket和EventSource实现服务端推送

    可能有很多的同学有用 setInterval 控制 ajax 不断向服务端请求最新数据的经历(轮询)看下面的代码: setInterval(function() { $.get('/get/data- ...