Opera上的html下拉列表缺少填充
在IE9、Firefox和Chrome上,我的下拉列表看起来很棒。但是Opera缺少2-3像素的填充,我在这些菜单中有一些带有单字符条目的表单,看起来很糟糕Opera上的html下拉列表缺少填充,html,css,opera,Html,Css,Opera,在IE9、Firefox和Chrome上,我的下拉列表看起来很棒。但是Opera缺少2-3像素的填充,我在这些菜单中有一些带有单字符条目的表单,看起来很糟糕 两边的空格会使它看起来不错,但在其他浏览器上看起来不好,而且还会把我的脚本搞砸 没有代码很难说 但是,您可以使用jQuery仅针对Opera: if($.browser.opera){ $('select').css(//DO WHATEVER); } 这将使其他浏览器保持不变 Fwiw。。。我会检查你的访客数据。Opera的使用
两边的空格会使它看起来不错,但在其他浏览器上看起来不好,而且还会把我的脚本搞砸 没有代码很难说 但是,您可以使用jQuery仅针对Opera:
if($.browser.opera){
$('select').css(//DO WHATEVER);
}
这将使其他浏览器保持不变
Fwiw。。。我会检查你的访客数据。Opera的使用率可能很低/根本不存在,因此可能不需要进行修复。我创建此功能只是为了检测iOS设备:
138 (function () {
139 // ios detection (select menus are ugly)
140 if (navigator.userAgent.toLowerCase().search('iphone') != -1 || navigator.userAgent.toLo werCase().search('ipod') != -1 || navigator.userAgent.toLowerCase().search('ipad') != -1 ) {
141 // set css rule for input
142 var style = document.createElement('style');
143 style.setAttribute('type','text/css');
144 style.innerHTML = 'select{ color: #333; }'; // custom css for select on ios
145 document.getElementsByTagName('head')[0].appendChild(style);
146 }
147 })();
我想我在歌剧方面也可以做同样的事
对于原始问题,我创建了一个新站点来测试该问题:
1 <head><style type='text/css'>
2 select {
3 background-color: #353535;
4 border: 2px solid #555555;
5 color: #c0c0c0;
6 }
7 </style></head><body>
8 <select>
9 <option>0</option>
10 </select></body>
所发生的事情是,当我设置样式来修改select的边框或背景颜色时,它会从外观整洁的下拉菜单样式更改为外观老式的方形按钮,而且它还去掉了一些填充。不过,没有人使用Opera,所以我可能永远也不会抽出时间来解决这个问题 谢谢你的演示。添加某些样式进行选择会产生副作用,看起来像是一个布局错误。添加这样的内容怎么样:
width: 2em;
text-align:center;
??我没有在其他浏览器中测试过它,但我想它应该只是增强了它们的默认呈现功能。您能创建一个JSFIDLE页面或给我们一个链接来查看问题吗?