select multiple 时一般是设置 height

<select multiple="multiple" style="height:87px;">
<option>1111111111111111111111</option>
<option>2222222222222222222222</option>
<option>3333333333333333333333</option>
<option>4444444444444444444444444</option>
<option>555555555555555555555555</option>
<option>666666666666666666666666</option>
<option>7777777777777777777777</option>
<option>888888888888888888888</option>
<option>999999999999999999999</option>
</select>

上面的代码在 Firfox chrome 上都显示正常,但在 IE 下就成

在网上查了下,由于 option 由浏览器控制,不受 CSS 控制,一般做法是不设置 height 而是用 size

    <select multiple="multiple" size="5">
<option>1111111111111111111111</option>
<option>2222222222222222222222</option>
<option>3333333333333333333333</option>
<option>4444444444444444444444444</option>
<option>555555555555555555555555</option>
<option>666666666666666666666666</option>
<option>7777777777777777777777</option>
<option>888888888888888888888</option>
<option>999999999999999999999</option>
</select>

但是设置 size 有一个问题就是当 size 为 1 时在 Firfox 上面显示的不正常,不知道如何解决。

参考:http://formalize.me/jquery_demo.html

select multiple 浏览器兼容的更多相关文章

  1. jQuery-1.9.1源码分析系列(七) 钩子(hooks)机制及浏览器兼容

    处理浏览器兼容问题实际上不是jQuery的精髓,毕竟让技术员想方设法取弥补浏览器的过错从而使得代码乱七八糟不是个好事.一些特殊情况的处理,完全实在浪费浏览器的性能:突兀的兼容解决使得的代码看起来既不美 ...

  2. js 浏览器兼容的一些方法

    使用js是一件令人很抓狂的事情,很多的浏览器兼容,一大推的代码,谁的脑袋能记住那么多的东西,只有平时多积累,所谓熟能生巧嘛..这里列出一些常用的兼容代码,一点点积累哈~~~     一.以跨浏览器的方 ...

  3. 【转】Web前端浏览器兼容初探

    原文地址:http://blog.jobbole.com/38638/ 前言 浏览器兼容是前端开发人员必须掌握的一个技能,但是初入前端的同学或者其他后台web开发同学往往容易选择忽略,而形成两个极端: ...

  4. IE、FF、Safari、OP不同浏览器兼容报告

    IE.FF.Safari.OP不同浏览器兼容报告 1         浏览器内核简介 Trident IE浏览器(GreenBrowser绿色浏览器, 遨游浏览器....都是IE) Geckos Fi ...

  5. CSS在不同浏览器兼容问题,margin偏移/offset溢出等

    margin在垂直取值时取最大值 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "h ...

  6. Web前端浏览器兼容初探

    浏览器兼容是前端开发人员必须掌握的一个技能,但是初入前端的同学或者其他后台web开发同学往往容易选择忽略,而形成两个极端: 1 我最开始都是使用IE6,IE6上没问题,其它浏览器坑爹(多出现与前端后端 ...

  7. JS浏览器兼容问题

    一.JS与DOM的兼容性: (一) DOM节点的访问: 1.以前对DOM节点访问一般用“document.All.元素ID属性值”或者“document.元素ID属性值”这种简化的方法,在FireFo ...

  8. [转]Web前端浏览器兼容

    转自: http://www.admin10000.com/document/1900.html 前言 浏览器兼容是前端开发人员必须掌握的一个技能,但是初入前端的同学或者其他后台web开发同学往往容易 ...

  9. 前端编程提高之旅(三)----浏览器兼容之IE6

    在爱奇艺实习期间,乐帝主要负责移动端活动页面的制作,因为移动浏览器是随着智能手机兴起的,这就决定了移动端不会重蹈浏览器兼容问题的覆辙.一開始就比較好的支持web标准,而纵观整个互联网行业,移动web开 ...

  10. 搞了一次IE浏览器兼容,我有点奔溃....

    浏览器兼容问题(主要时IE上遇到的坑坑坑) caniuse 工具(基本参考作用,实际还是需要测试) (1)安装babel-polyfill基本操作了,IE浏览器没有内置Promise对象,不仅如此,几 ...

随机推荐

  1. php 安装 自带扩展

    # 进入安装包解压目录 cd /usr/local/src/php-8.0.0/ # 进入扩展目录 cd ext/gd # 编译 phpize # 配置 ./configure --with-php- ...

  2. cuda+pytorch环境安装

    本机cuda版本为v11.5 conda install cudatoolkit 使用 CUDA 11.3版本的配置 conda install pytorch==1.11.0 torchvision ...

  3. java字段值为null,不返回该字段

    jackSon注解– @JsonInclude 注解不返回null值字段 @Data @JsonInclude(JsonInclude.Include.NON_NULL) public class R ...

  4. Android中添加set文件

    一般情况下,set文件在anim目录下面,如果没有anim目录,就新建一个. 1. 右键点击anim,选择new->Animation Resource File 2. 选择类型为set,点击O ...

  5. 沁恒蓝牙系列芯片USB烧录故障排查

    目录 使用USB烧录时让ISP工具能够识别芯片的操作是按住评估板上的"Download"按键,或者将PB22短接到GND,同时给板子上电.若是第一次拿到芯片,codeflash中是 ...

  6. 074_Wrapper_Class

    https://developer.salesforce.com/page/Wrapper_Class http://www.sfdcpoint.com/salesforce/wrapper-clas ...

  7. Linux系统Shell脚本第六章:文件三剑客之sed

    Shell编程三剑客之sed 前言 一.Sed编辑器 (1)Sed概述 (2)Sed工作流程 (3)Sed基本语法 二.Sed用法示例 (1)Sed输出指定行 (2)插入符合条件的行 (3)删除符合条 ...

  8. vscode中配置代码片段

    首先我们需要把要配置的代码复制一下,如: 然后我们进入https://snippet-generator.app/网站, 进入网站之后就把你复制的代码粘贴到左边的框里面,然后就是代码的类型和命名了 写 ...

  9. js获取各种高度的方法

    js获取各种高度的方法 源文章:https://www.cnblogs.com/MrzhangRecord/p/9185868.html 目录 js获取各种高度的方法 1.获取元素的高度 模板:htm ...

  10. 「SOL」打扫笛卡尔cartesian (模拟赛)

    为什么会有人推得出来第三题想不出来签到题啊 (⊙_⊙)? 题面 有一棵有根树 \(T\).从根节点出发,在点 \(u\) 时,设点 \(u\) 还有 \(d\) 个未访问过的儿子,则有 \(\frac ...