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; }

清除Css中select的下拉箭头样式的更多相关文章

  1. css清除select的下拉箭头样式

    <!DOCTYPE html><html>    <head>        <meta charset="UTF-8">      ...

  2. 怎么去掉select的下拉箭头和输入框input类型为number时的上下箭头

    一.去掉select的下拉箭头 方法一:在select外面加一个div,设置select宽度大于div的宽度,并加一个超出隐藏属性overflow:hidden,小三角会隐藏掉: 方法二:给selec ...

  3. select默认下拉箭头改变、option样式清除

    谷歌.火狐.ie下 select 的默认下拉箭头图标差别还是比较大,一般我们都会清除默认样式,重新设计箭头图标: /* --ie清除--*/ select::-ms-expand{ display: ...

  4. 用纯css改变select的下拉菜单

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

  5. select下拉箭头样式重置

    select{ appearance:none; -moz-appearance:none; -webkit-appearance:none; background: url("../ima ...

  6. 如何修改select标签的默认下拉箭头样式?

    对于一般的项目而言,select标签在浏览器中表现出来的默认样式也不算丑,但是一次项目中,项目经理却要求对select标签本身进行样式修改,美化其下拉小箭头的样式.我思考和尝试了许多方法,最终得到一种 ...

  7. select自定义下拉三角符号,css样式小细节

    本来没有写文章的习惯,但是闲下来了,整理资料,发现还挺纠结,对前端来说.所以整理下,希望对看到的人有所帮助,毕竟我不是前端开发. 起因,是前端告诉我select 框的三角箭头不能自定义.但是第二次的时 ...

  8. select下拉箭头改变,兼容ie8/9

    各个浏览器下select默认的下拉箭头差别较大,通常会清除默认样式,重新设计 <html> <head> <meta charset="utf-8"& ...

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

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

随机推荐

  1. magento 12 配置安装教程

    Magento (麦进斗) 是一套专业开源的电子商务系统.Magento设计得非常灵活,具有模块化架构体系和丰富的功能.易于与第三方应用系统无缝集成.其面向企业级应用,可处理各方面的需求,以及建设一个 ...

  2. 理解JAVASCRIPT 中hasOwnProperty()和isPrototypeOf的作用

    hasOwnProperty:是用来判断一个对象是否有你给出名称的属性或对象.不过需要注意的是,此方法无法检查该对象的原型链中是否具有该属性,该属性必须是对象本身的一个成员.格式如下: 1. 示例一: ...

  3. Python MongoDB Spatial Query

    //引入Pymongo >>> from pymongo import MongoClient,GEO2D // 链接数据库gis >>> db = MongoCl ...

  4. C#基础视频教程7.5 如何编写简单游戏

    有一些BUG需要处理,比如小鸟太高或者太低都应该报错(不然直接掉到窗口下面去了),这个方法跟前面的HitTest应该独立开来,而不是掺和在一起   测试确实可以检测是否超过边界(如果要非常精确,那么就 ...

  5. es5 - array - sort

    /** * 描述:该sort()方法对数组中的元素进行排序并返回该数组,默认排序顺序是根据字符串Unicode代码点. * 语法:arr .sort([compareFunction]) * 参数: ...

  6. TP模板中如何使用函数

    TP模板中如何使用函数 TP中如何将时间戳转换为时间显示 我们往往需要对模板输出变量使用函数,可以使用: {$data.name|md5} 编译后的结果是: <?php echo (md5($d ...

  7. JAVA生成解析二维码

    package com.mohe.twocode; import java.awt.Color; import java.awt.Graphics2D; import java.awt.image.B ...

  8. JS 运算、判断优化

    1.二级制操作优于Math 如: //函数向下取整 console.log(Math.floor(8.9)); //二进制向下取整 console.log(8.9>>0); 2.慎用|| ...

  9. 〖Android〗/system/etc/fallback_fonts.xml

    <?xml version="1.0" encoding="utf-8"?> <!-- Fallback Fonts This file sp ...

  10. ASP.Net中后台控制页面提示信息的显示方式

    ASP.Net中后台控制页面提示信息的显示方式   用于删除或修改成功后的显示:(背景No空白) ScriptManager.RegisterStartupScript(this, typeof(Pa ...