<!DOCTYPE html>

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

 <title>利用css新属性appearance优化select下拉框</title>

 <style type="text/css">

 body{ padding:100px;}

 select{ border:1px solid #ccc;

         padding-right:30px;

         appearance:none;

         -moz-appearance:none; /* Firefox */

         -webkit-appearance:none; /* Safari and Chrome */

         background:url(images/ico.png) no-repeat right center;

         }

 select::-ms-expand {

   display: none;

 }

 </style>

 </head>

 <body>

 <select>

 <option value="ec3bd039-f3a5-e411-8154-5404a6f3ab2f">所有分类</option>

 <option value="bbf39f6f-f4a5-e411-8154-5404a6f3ab2f">食品</option>

 </select>

 </body>

 </html>






收到网上一篇文章的启发：http://www.cnblogs.com/PeunZhang/p/3522603.html


 


												


											
利用css新属性appearance优化select下拉框的更多相关文章
	

    
								
  1. css配合js模拟的select下拉框
		
    css配合js模拟的select下拉框 <!doctype html> <html> <head> <meta charset="utf-8&quo ...
    
		
    2. 
						
  2. 点击select下拉框获取option的属性值
		
    select下拉框作为前端开发者应该是经常使用的,最近在项目中遇到这样的情况,点击下拉框选项,需要获取所点击的option的属性值,当时想很简单啊,给option加一个点击事件不就行了,然后就加了一下 ...
    
		
    3. 
						
  3. 带搜索框的select下拉框
		
    利用select2制作带有搜索功能的select下拉框 1.引入线上css和js <link href="https://cdnjs.cloudflare.com/ajax/libs/ ...
    
		
    4. 
						
  4. 《手把手教你》系列技巧篇（三十二）-java+ selenium自动化测试-select 下拉框（详解教程）
		
    1.简介 在实际自动化测试过程中,我们也避免不了会遇到下拉选择的测试,因此宏哥在这里直接分享和介绍一下,希望小伙伴或者童鞋们在以后工作中遇到可以有所帮助. 2.select 下拉框 2.1Select ...
    
		
    5. 
						
  5. 自定义样式的select下拉框深入探索
		
    第一个版本: 首先实现自定义select下拉框应该具有的功能,我是选择将原来的select隐藏掉,自己在jquery代码中动态写进去<dl><dd><dt>这样的结 ...
    
		
    6. 
						
  6. HTML中的select下拉框内容显示不全的解决办法
		
    HTML中的select下拉框内容显示不全的解决办法 今天,我遇到这样一个问题:查询栏中的下拉框中的内容过长,导致部分被覆盖了. 查询了一些资料,有的说用函数控制,有的说用事件控制,有的看不懂,有的实 ...
    
		
    7. 
						
  7. 2.10 select下拉框
		
    2.10 select下拉框 本篇以百度设置下拉选项框为案例,详细介绍select下拉框相关的操作方法. 一.认识select    1.打开百度-设置-搜索设置界面,如下图所示 2.箭头所指位置,就 ...
    
		
    8. 
						
  8. Selenium2学习（十一）-- select下拉框
		
    本篇以百度设置下拉选项框为案例,详细介绍select下拉框相关的操作方法. 一.认识select    1.打开百度-设置-搜索设置界面,如下图所示 2.箭头所指位置,就是select选项框,打开页面 ...
    
		
    9. 
						
  9. firefox浏览器中 bootstrap 静态弹出框中select下拉框不能弹出（解决方案）
		
    问题出现场景1: 在firefox浏览器中在bootstrap弹出的modal静态框中再次弹出一个静态框时 select下拉框不能弹出选项 解决方案:去掉最外层静态框的 tabindex=" ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. js多物体任意值运动
			
    假如有两个div,一个div要变宽,一个div要变高,你怎么写呢? 哎呀,写2个方法啊,一个控制div1变宽,一个控制div2变高啊 那么你的代码,是不是下面这样的呢! 示例:Div变宽和变高 现象: ...
    
			
    2. 
						
  2. uva 1393 - Highways(容斥原理)
			
    题目连接:uva 1393 - Highways 题目大意:给定一个m∗n的矩阵,将矩阵上的点两两相连,问有多少条直线至少经过两点. 解题思路:头一次做这样的题目,卡了一晚上. dp[i][j]即为i ...
    
			
    3. 
						
  3. POJ 1384 Piggy-Bank 背包DP
			
    所谓的全然背包,就是说物品没有限制数量的. 怎么起个这么intimidating(吓人)的名字? 事实上和一般01背包没多少差别,只是数量能够无穷大,那么就能够利用一个物品累加到总容量结尾就能够了.  ...
    
			
    4. 
						
  4. NGUI判断是否点击到UI控件
			
    注意:UI应加上Box Collider 1.射线检测 UICamera发一条射线,射线碰到了东西就说明点击到了UI Ray ray=UICamera.mainCamera.ScreenPointTo ...
    
			
    5. 
						
  5. WebAPI通过multipart/form-data方式同时上传文件以及数据（含HttpClient上传Demo）
			
    简单的Demo,用于了解WebAPI如何同时接收文件及数据,同时提供HttpClient模拟如何同时上传文件和数据的Demo,下面是HttpClient上传的Demo界面 1.HttpClient部分 ...
    
			
    6. 
						
  6. pdf转换为word小工具，挺好
			
    watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvZGFwZW5nMDExMg==/font/5a6L5L2T/fontsize/400/fill/I0JBQk ...
    
			
    7. 
						
  7. Webx框架：Valve详细解释
			
    Valve请求,用于控制过程的操作.它采用责任设计模式链(类别似至struts拦截器).valve阀装置,阀控制水流量(网络请求)趋势. 他们阀门定义. public class MyValve im ...
    
			
    8. 
						
  8. C# WinForm 拖动无边框窗体 改变无边框窗体尺寸
			
    经常遇到这种情况.窗体的边框去掉了.然后种种问题就出来了:不能拖动.不能改变窗体大小.不能．．．．．．当然.肯定有解决方案滴*^_^*今天的目标就是:可以直接拖动没有边框的窗体.可以直接拉拽窗体改变其 ...
    
			
    9. 
						
  9. 大约linux的几个问题，你能回答几个？--回复14-20称号
			
    14.select和poll差异?Poll和epoll的差别? (1)select和poll的差别:(參考:http://blog.csdn.net/mituan2008/article/detail ...
    
			
    10. 
						
  10. B/S VS C/S
			
    从软件project的学习到如今的机房合作,我们一直在学习C/S,进入牛腩才正式进入了对B/S的了解,确切点牛腩则是对此的一个过渡,起到了承上启下的作用!看牛腩,事实上最大的感受就是他不止要设计到页面 ...
    
			
    11.