select multiple 浏览器兼容

　　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

转载于:https://www.cnblogs.com/cg6811568/p/3794033.html