<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style>
        select::-ms-expand { display: none; }          
         .info-select{
            width: 88px;
            height: 25px;
            border: none;
            outline: none;
            /*将默认的select选择框样式清除*/
            appearance:none;
            -moz-appearance:none;
            -webkit-appearance:none;
            -ms-appearance:none;
           /*在选择框的最右侧中间显示小箭头图片*/
           background: url(img/sele.png) no-repeat scroll right center transparent;     /***将sele.png替换为你的下拉箭头**/      
         }
        </style>
    </head>
    <body>
        <select class="info-select">
            <option selected="selected">1</option>
            <option>2</option>
        </select>
    </body>
</html>

本例可以更换selet下拉箭头,只适用于非ie浏览器,ie样式为默认样式

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

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

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

  2. select下拉箭头样式重置

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

随机推荐

  1. word中替换内容

    参考了一篇文章 然后做了如下修改  用python的win32com模块替换word中的文字搞定批量打印奖状 python 操作 office python操作word # -*- coding: u ...

  2. Java8集合框架——LinkedHashMap源码分析

    本文的结构如下: 一.LinkedHashMap 的 Javadoc 文档注释和简要说明 二.LinkedHashMap 的内部实现:一些扩展属性和构造函数 三.LinkedHashMap 的 put ...

  3. Emacs: 设置窗口标题格式

    Emacs默认的窗口标题常常比较简单,例如我的默认标题是"emacs@ubuntu".如果想要在标题中显示更多的信息,我们可以对它进行一些设置.由于Emacs的可扩展性,这种修改实 ...

  4. 102-PHP多维数组的元素输出

    <?php //定义一个三维数组 $grade=array('class1'=>array('stu1'=>array('yuwen'=>85,'shuxue'=>95, ...

  5. delphi dll编写与调用

    dll代码: mydll.dpr library mydll; uses System.SysUtils, System.Classes, uFunction in 'uFunction.pas'; ...

  6. oracle中判断"非"

    在oracle中判断为"非"最常见的两种情况,一个是"不等于",一个的"非空". 通过查找资料得知,oracle中判断不等于的方法有好多种: ...

  7. sed -i添加到第一行

    用sed的i\命令在第一行前面插入即可,加上 -i 选项直接操作文件. sed -i '1i\要添加的内容' yourfile 查看插入第一行是否成功 sed -n '1,1p' yourfile

  8. c++程序—浮点数

    #include<iostream> using namespace std; int main() { //2.单精度float //3.双精度double //默认情况下会输出6位有效 ...

  9. python练习(一)----打印九九乘法表

    打印九九乘法表 ,): ,i+): print("{0} x {1} = {2} \t".format(j,i,i*j),end='') //print默认end=‘\n’, pr ...

  10. jquery实现搜索框从中间向两边扩展(左右放大)

    显示效果: 隐藏效果: 前端核心代码如下: <div class="search-icon col-md-2 col-sm-2 col-xs-4 col-md-offset-5 col ...