问题：

　　在为表单添加下拉菜单时，有时候对菜单的样式没有特别的要求，就是需要修改下select元素的宽度和高度，但众所周知select元素的样式很难修改；

select在各个浏览器，字体大小为14px时的高度为20px

　　希望是这样的，对边框样式也什么需求

　　

　　但在IE7，IE8下的表现确实这样的

　　

差别有点明显，遂在select上设置line-height怎么都没有用，查看各个浏览器（没有测试safari和opera浏览器）设置line-height:对select的高度都没有什么影响；

解决办法：

　　此方法不适用IE7及以下浏览器

　　为了select也浏览器中有统一的高度，只给select元素设置padding来增加高度，对字体大小有限制的可以合并使用padding, font-size；从而达到统一的高度；

<!DOCTYPE html>

<html lang="zh-CN">

  <head>

    <meta charset="utf-8">

    <title>Bootstrap 101 Template</title>

	<style>

		select{width:200px; padding:20px 0; *height:60px/*为IE7设置高度*/}

	</style>

  </head>

  <body>

  <form>

	<select>

		<option value="0">人民币</option>

		<option value="0">美元</option>

		<option value="0">越南盾</option>

		<option value="0">法郎</option>

	</select>

  </form>

  </body>

</html>

总结：

对select高度有影响的CSS属性：height, padding, font-size, zoom

为select 设置样式的更多相关文章

  1. input与select 设置相同宽高，在浏览器上却显示不一致，不整齐

    遇到 input与select 设置相同宽高,在浏览器上却显示不一致,遂实验了下(IE 10.013 ,Firefox 30.0),得出以下结论 input   width,height 值里面, 不 ...

  2. c# Chart设置样式

    一.chart属性熟悉 能够对C# chart控件属性熟悉起帮助的code, 现在分享给大家,Chart Operate Demo Code Download,如有帮助,别忘点个赞. Chart    ...

  3. 如何给DropDownList控件设置样式（ASP.NET MVC）

    前话: 应学校领导要求,要给后台管理系统添加一个搜索功能,提供可选择选项.我选择使用DropDownList去实现,熟悉.net控件的都知道,DropDownList的样子非常丑,不论是边框长宽还是里 ...

  4. 改变select箭头样式

    链接:https://blog.csdn.net/java_zhaoyanli/article/details/52549787 改变select箭头样式的方法: 1,去掉箭头: 2,设置图片为背景: ...

  5. word-wrap&&word-break，奇偶行、列设置样式

    1.word-wrap和word-break区分. 来源场景:机械租赁mvc驾驶员信息查看: 当备注的文字多的时候,第一列的值成这模样: 解决方案:设置table 的td可自动换行.首先table设置 ...

  6. 注意Android里TextView控件的一个小坑，用android:theme来设置样式时动态载入的layout会丢失该样式

    注意Android里TextView控件的一个小坑,用android:theme来设置样式时动态载入的layout会丢失该样式 这个坑,必须要注意呀, 比如在用ListView的时候,如果在List_ ...

  7. Vue系列： 如何通过组件的属性props设置样式

    比如我们要在vue中显示百度地图,然后将相关的代码包装成组件,然后需要由外部来设置组件的高度,关于props的介绍,可以参考: http://cn.vuejs.org/guide/components ...

  8. 【使用 DOM】为DOM元素设置样式

    1. 使用样式表 可以通过document.styleSheets属性访问文档中可用的CSS样式表,它会返回一组对象集合,这些对象代表了与文档管理的各个样式表. 每个样式表 都由一个CSSStyleS ...

  9. 【温故而知新-Javascript】为DOM元素设置样式

    1. 使用样式表 可以通过document.styleSheets属性访问文档中可用的CSS样式表,它会返回一组对象集合,这些对象代表了与文档管理的各个样式表. 每个样式表 都由一个CSSStyleS ...

随机推荐

  1. tomcat 8.5.9.0 解决catalina.out过大的问题

    先吐嘈一下tomcat这个项目,日志切割这么常见的功能,tomcat这种知名开源项目默认居然不开启,生产环境跑不了几天,磁盘就满了,而且很多网上流传的方法,比如修改conf/logging.prope ...

  2. C#组件系列——又一款Excel处理神器Spire.XLS，你值得拥有

    前言:最近项目里面有一些对Excel操作的需求,博主想都没想,NPOI呗,简单.开源.免费,大家都喜欢!确实,对于一些简单的Excel导入.导出.合并单元格等,它都没啥太大的问题,但是这次的需求有两点 ...

  3. C#获取CPU占用率、内存占用、磁盘占用、进程信息

    代码: using System; using System.Collections.Generic; using System.Diagnostics; using System.Threading ...

  4. H5是什么，CSS3又是什么？

    经常有客户咨询说你们会做H5吗,就像这个,拿过来一看,一个上下滑动的贺卡,这已经成为了大部分人对H5的理解,甚至很多大公司都推出了制作这种动画的工具,可以快速生成此类页面.(其实,这就用到了一些CSS ...

  5. SOD让你的旧代码焕发青春

    最近接手了一个旧的系统,各种陈旧的问题比较多,其中最棘手的就是操作数据库的部分,具体如下: 1.核心库是一个最后修改时间为2008年的库,先不说有多陈旧,现在这个库只是一个DLL文件,没有源码,也已经 ...

  6. django 进阶篇

    models(模型) 创建数据库,设计表结构和字段 使用 MySQLdb 来连接数据库,并编写数据访问层代码 业务逻辑层去调用数据访问层执行数据库操作 import MySQLdb def GetLi ...

  7. js杂项

    css是 下划线命名法:table_sub ;javascript ,net ,sql 全部是camel命名法 找临界点 1.elem.checked 有两个值,true,false . 页面中< ...

  8. EasyUI 解决 datagrid 中 NumberBox 限制小数位数后不能输入小数点问题

    初始化界面,发现编辑datagrid,不能输入小数点. var arrColumnsCNT = [[ { title: '毛重', field: 'GrossWeight', halign: 'cen ...

  9. Ubuntu学习总结-10 XManager

    最近接触到一个很有意思的实验,在这里与大家分享,实验目标在Window显示UBuntu程序. 1 测试环境: Windows8的IP地址 : 192.168.7.126 UBuntu16的IP地址 : ...

  10. 常用的js方法,包括表单校验的一些方法

    /** * 对JSON对象转换为字符串. * @param {json对象} json * @return {json字符串} */ function jsonObj2Str(json) { var ...