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

/*很关键:将默认的select选择框样式清除*/
appearance:none;
-moz-appearance:none;
-webkit-appearance:none;

/*在选择框的最右侧中间显示小箭头图片*/
background: url("http://ourjs.github.io/static/2015/arrow.png") no-repeat scroll right center transparent;

/*为下拉小箭头留出一点位置,避免被文字覆盖*/
padding-right: 14px;
}

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

原文https://www.cnblogs.com/lsy26/p/5840860.html

重写select样式的更多相关文章

  1. 打造自定Select样式

    打造自定Select样式 我们为什么要自定义select样式? 1.select最大的一个缺陷就是不能自定义下拉按钮的样式. 效果图: 在线演示地址: http://www.smallui.com/j ...

  2. 修改 页面中默认的select样式

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

  3. CSS select样式优化 含jquery代码

    CSS 下拉选择菜单基本的CSS样式不怎么好看,通过一些简单的样式优化,可以得到如下图这样的: html结构如下: <div class="sel_wrap"> < ...

  4. SELECT样式,兼容IE6

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. CSS效果:CSS select样式优化 含jquery代码

    CSS 下拉选择菜单基本的CSS样式不怎么好看,通过一些简单的样式优化,可以得到如下图这样的: html结构如下: <div class="sel_wrap"> < ...

  6. 通过css属性hack完成select样式美化,并兼容IE

    最近在重构时遇到了select样式问题,并且需要在不影响语义化的情况下,兼容IE8. 经过一番的百度后始终没有找到合适的纯CSS解决方案,最后换了一下思路,大胆使用了属性hack: 在chrome和F ...

  7. IE、火狐、谷歌浏览器下兼容统一select样式

    项目开发时,对于不同浏览器下的select样式不统一问题,各种查,这里记录一下,项目已使用 IE浏览器下样式: 火狐浏览器下样式: 谷歌浏览器下样式: 上代码: 1.html 2.css 至此,大功告 ...

  8. select样式调整

    如果select样式如下图:是因为添加了 border-color:#adb7d6; border-width:1px; 样式 删除上面两个样式属性,效果如下图:

  9. jqueryMobile中select样式自定义

    要去掉引入的jqueryMobile给下拉框组件的样式,有两种办法. 第一种:全局的去掉所有的下拉框样式: <link rel="stylesheet" href=" ...

随机推荐

  1. SudaMod-81.0 / crDroidAndroid-8.1(android-8.1.0_r20)红米3 2018年5月3日更新

    一.写在前面 我只是个人爱好,本ROM未集成任何第三方推广软件,我只是喜欢把好的资源分享出来,若可以,我们一起学习,一起进步. 请不要问我怎么刷机! 请不要问我玩游戏卡不卡(有钱你就换好点的手机)! ...

  2. mybatis 映射器(mappers) 配置说明 加载映射文件方式

    映射器(mappers) 既然 MyBatis 的行为已经由上述元素配置完了,我们现在就要定义 SQL 映射语句了.但是首先我们需要告诉 MyBatis 到哪里去找到这些语句. Java 在自动查找这 ...

  3. awk使用总结

    转载自董的博客 1. 什么是awk awk是Unix/Linux提供的样式扫描与处理工具,非常擅长处理结构化数据和生成表单.与sed 和grep 很相似,但功能却超过大于两者,由于awk具备各种脚本语 ...

  4. open-falcon监控Flume

    1.首先你需要知道flume的http监控端口是否启动 请参考博文 Flume的监控参数 即在 http://localhost:3000/metrics 可以访问到如下内容 2.在open-falc ...

  5. Jquery EasyUI Combotree和 EasyUI tree展开所有父节点和获取完整路径

    Jquery EasyUI Combotree展开所有父节点 Jquery EasyUI Combotree获取树完整路径 Jquery EasyUI tree展开所有父节点 Jquery EasyU ...

  6. vue filter方法-时间格式化

    plugins/filter.js import Vue from 'vue' // 时间格式化 // 用法:<div>{{data | dataFormat('yyyy-MM-dd hh ...

  7. JDK 5.0 注解知识快速进阶

    1.了解注解 对于Java开发人员来说,在编写代码时,除了源程序外,还会使用Javadoc标签对类.方法或成员变量进行注释,一遍使用Javadoc工具生成和源代码配套的Javadoc文件,如@para ...

  8. react 中的绑定事件

    handleOpen = (e)=> { this.setState({ open: true }) } <Button color='primary' onClick={this.han ...

  9. python接口自动化测试(c测试环境的准备)

    接口测试的方式有很多,比如可以用工具(jmeter,postman)之类,也可以自己写代码进行接口测试,工具的使用相对来说都比较简单,重点是要搞清楚项目接口的协议是什么,然后有针对性的进行选择,甚至当 ...

  10. react+dva+antd项目构建

    一:版本升级 首先说明一下这里的dva是最新版: 2.3.2 1.初始化项目构建 npm install dva-cli -g dva -v dva-cli version 注:通过 npm 安装 d ...