在我们用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. 【Linux开发】【Qt开发】tslibs的配置(触摸屏没有,HDMI屏幕):Qt界面响应USB鼠标

    s3c2416   linux qt4.x 由于触摸屏坏了,板子只能用鼠标了,结果以前可以用的现在鼠标突然不能用了 为此交叉编译了qt的多个版本,也换过根文件系统,以为是tslib版本的问题,却发现q ...

  2. vue+egg.js+mysql一个前后端分离留言板项目

    一.前序 我相信每个人前端搬运工和我想法都是一样的,都有一个做全栈的梦,无奈面对众多的后台语言,却不从下手,今天由我来带你们潜入全栈的门槛,注意是门槛.能不能学的会后面的内容全靠坚持了. 我今天主要做 ...

  3. Nginx跨域问题

    Nginx跨域无法访问,通常报错: Failed to load http://172.18.6.30:8086/CityServlet: No 'Access-Control-Allow-Origi ...

  4. 部署第一个servlet应用到tomcat上

    部署第一个servlet应用到tomcat上 搭建环境 eclipse的EE版本 eclipse官网 创建一个java的应用程序 1.File->new java project 导入servl ...

  5. selenium 教程

    selenium 本身是一套web自动化测试工具,但其经常被用于爬虫,解决一些复杂爬虫的问题. selenium 用于爬虫时,相当于模拟人操作浏览器. 浏览器驱动 使用 selenium 需要先安装 ...

  6. 吴恩达机器学习7:代价函数(Cost function)

    一.简介 1.在线性回归中,我们有一个这样的训练集,M代表训练样本的数量,假设函数即用来进行预测的函数是这样的线性函数的形式,我们接下来看看怎么选择这两个参数: 2.如下图中,怎么选择两个参数来更好的 ...

  7. vue编写轮播图组件

    <template>  <div id="slider">    <div class="window" @mouseover=& ...

  8. 内存分析工具MAT(Memory Analyzer Tool)从安装到使用

    一.安装 首先,你得有一个Eclipse(因为MAT是Eclipse的插件) 然后,你要在Eclipse上安装MAT,步骤如下: 1.点击Help,Install New Soft,就出现了以下Ins ...

  9. 2018-8-10-dotnet-core-编程规范

    title author date CreateTime categories dotnet core 编程规范 lindexi 2018-08-10 19:16:52 +0800 2018-05-0 ...

  10. mplayer - Linux下的电影播放器

    概要 mplayer [选项] [ 文件 | URL | 播放列表 | - ] mplayer [全局选项] 文件1 [特定选项] [文件2] [特定选项] mplayer [全局选项] {一组文件和 ...