<!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. git 常用命令及问题解决（转）
			
    git init 产生的目录解释error: src refspec master does not match any.引起该错误的原因是,目录中没有文件,空目录是不能提交上去的error: ins ...
    
			
    2. 
						
  2. Source Insight 3.X 插件支持utf8，完美解决中国乱码，连接到美丽的轮廓
			
    上次SI多标签插件之后,由于公司内部编码改为utf8编码,因此特意做了这个Source Insight 3.X utf8插件. 下载地址:http://pan.baidu.com/s/1mgyZous ...
    
			
    3. 
						
  3. ASP.NET 运行
			
    ASP.NET 运行 对于ASP.NET开发,排在前五的话题离不开请求生命周期.像什么Cache.身份认证.Role管理.Routing映射,微软到底在请求过程中干了哪些隐秘的事,现在是时候揭晓了.抛 ...
    
			
    4. 
						
  4. 深入解析_Android的自定义布局
			
    前言: 这篇文章是前Firefox Android工程师(现在跳槽去Facebook了) Lucas Rocha所写,文中对Android中常用的四种自定义布局方案进行了很好地分析,并结合这四种And ...
    
			
    5. 
						
  5. 在AcGIS随着大数据的生成DEM
			
    在ArcGIS产生DEM时间.数据来源是经常有的高程点.轮廓线,该高程点.等高线密集,可能有几千万.甚至亿高程点.轮廓线. 如果您使用这些矢量数据生成TIN.不能实现的,由于生成TIN时,支持的最大结 ...
    
			
    6. 
						
  6. Zen Coding in Visual Studio 2012
			
    http://www.johnpapa.net/zen-coding-in-visual-studio-2012 Zen Coding is a faster way to write HTML us ...
    
			
    7. 
						
  7. 【iOS开发-图层】自己定义图层的两种方式
			
    想要自己定义图层,仅仅须要构建一个类继承CALayer方法 假设让自己定义图层初始化上面就有画好的图形.有两种办法 重写drawInContext方法 自己定义的图层以下的方法.然后必须自己定义的图层 ...
    
			
    8. 
						
  8. Mac OS温馨提示17：七彩花哨的输入
			
    OSX Mavericks中国的文字输入功能,色于windows,甚至提供了强大的手写输入功能和语音输入功能,而且发展到如今,已经有非常多种第三方输入法支持Mac了. 一.主要的输入法         ...
    
			
    9. 
						
  9. Direct3D 使用质地
			
    关于使用质地 1 创建纹理 2 纹理寻址模式 3 纹理过滤 1 创建纹理 <1> D3DXCreateTexture功能 创建一个空的纹理. HRESULT  D3DXCreateText ...
    
			
    10. 
						
  10. 谈话节目APE系列：如何成为技术达人
			
    作为一个程序猿,总有消退的前辈.或更年轻的同行.牛逼的人总是羡慕. 让我们搞自己痛苦的日子 BUG .头发很快结束了抓,人们扫两.修改一行代码.问题得以克服:例如,他们自己开发的十年,少付 10K , ...
    
			
    11.