• 修改select样式


    CSS就可以解决,原理是将浏览器默认的下拉框样式清除,然后应用上自己的,再附一张向右对齐小箭头的图片即可。

     
    1. select {  
    2.   /*Chrome和Firefox里面的边框是不一样的,所以复写了一下*/  
    3.   border: solid 1px #000;  
    4.   
    5.   /*很关键:将默认的select选择框样式清除*/  
    6.   appearance:none;  
    7.   -moz-appearance:none;  
    8.   -webkit-appearance:none;  
    9.   
    10.   /*在选择框的最右侧中间显示小箭头图片*/  
    11.   background: url("http://ourjs.github.io/static/2015/arrow.png") no-repeat scroll right center transparent;  
    12.   
    13.   
    14.   /*为下拉小箭头留出一点位置,避免被文字覆盖*/  
    15.   padding-right: 14px;  
    16. }  
    17.   
    18.   
    19. /*清除ie的默认选择框样式清除,隐藏下拉箭头*/  
    20. select::-ms-expand { display: none; }  

    参考链接:
    http://uplifted.NET/programming/change-default-select-dropdown-style-just-css/

  • 相关阅读:
    HTML页引用CSS
    C#反射
    Marshal.SecureStringToBSTR
    SQL语句创建表和数据库
    抽象类和抽象方法
    3 Sum Closest
    Chapter 2: Binary Search & Sorted Array
    Spiral Matrix
    Pascal's Triangle
    Plus One
  • 原文地址:https://www.cnblogs.com/dongkx/p/7163261.html
Copyright © 2020-2023  润新知