浏览器兼容——国产浏览器下的select的文字高度不同等差异性展现方式

浏览器兼容——国产浏览器下的select的文字高度不同等差异性展现方式

使用bootstrap设置了select，
在QQ浏览器极速模式下的文字内容和360极速模式下的文字内容高度不一致。

经过一番查找，是浏览器内核不一致导致的。

国产浏览器大多是双内核，甚至是三内核。一个Chromium内核，也就是Chrome使用的内核，切换到这个内核的模式一般叫极速模式；一个IE内核，称之为IE模式；有的甚至还有一个修改过的IE内核，称之为兼容模式。

找到的解决方案：【通过meta代码强制浏览器使用WebKit内核】

<meta name="renderer" content="webkit"/>
<meta name="force-rendering" content="webkit"/>
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"/>

强制Chromium内核，作用于360浏览器、QQ浏览器等国产双核浏览器：

<meta name="renderer" content="webkit"/>

强制Chromium内核，作用于其他双核浏览器：

<meta name="force-rendering" content="webkit"/>

如果有安装 Google Chrome Frame 插件则强制为Chromium内核，否则强制本机支持的最高版本IE内核，作用于IE浏览器：

<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"/>

兼容性解决方案参考文章

通过meta代码强制浏览器使用WebKit内核_百度经验 https://jingyan.baidu.com/article/0f5fb09924dae56d8334ea16.html

前端开发中的兼容性问题-CSS篇 - CSDN博客 https://blog.csdn.net/Mankii/article/details/78458713