HTML
<select data-val="true" id="GameID" >
<option value="">Select Game...</option>
<option value="4">Counter Strike Source</option>
<option value="5">Medal Of Honor</option>
<option value="6">NFS Shift</option>
</select>
CSS
select
{
color: #fff;
background: url(/img/backgrounds/tab-hover-background.png) rgba(0,0,0,0);
border: 1px solid #8093BE;
width: 242px;
height: 20px;
}
option
{
background: url(/img/backgrounds/tab-hover-background.png) rgba(0,0,0,0);
}
- 在 Firefox 中它工作正常，
- 在 Opera 中它仅适用于选择，但不适用于选项
- 在 IE 9.0 和 IE 9.0 中。 Chrome 有一个奇怪的行为
我希望所有浏览器都像 Firefox 一样显示
这是一个来源
HTML
<select data-val="true" id="GameID" >
<option value="">Select Game...</option>
<option value="4">Counter Strike Source</option>
<option value="5">Medal Of Honor</option>
<option value="6">NFS Shift</option>
</select>
CSS
select
{
color: #fff;
background: url(/img/backgrounds/tab-hover-background.png) rgba(0,0,0,0);
border: 1px solid #8093BE;
width: 242px;
height: 20px;
}
option
{
background: url(/img/backgrounds/tab-hover-background.png) rgba(0,0,0,0);
}
- In Firefox it works fine,
- In Opera it works only for select,but not for option
- In IE 9.0 & Chrome it has a strange behavior
I want all browsers to display like Firefox
this is a source
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
更改表单元素的样式并不那么容易。每个浏览器都有自己的自己的方式来渲染和创建这些元素。有些浏览器会接受在您选择的内容中包含背景图像，而其他浏览器则不会。
一个简单的技术是添加默认颜色，这样浏览器在无法渲染图像时就会渲染该颜色。
这样，Firefox 用户将看到背景图像（在我看来，它总是看起来很难看），而其余浏览器将以灰色背景显示。
希望这有帮助
Its not that easy to change form element's style.. each browser has it's own way to render and create those elements. Some browsers will accept having a background image inside your select, others won't.
A simple technique is to add a default color, so the browser will render the color if it cant render the image.
so this way, firefox users will see a background image (something that always looks ugly, in my opinion) and the rest of the browsers will display with a gray background.
Hope this helps
您的 Alpha 透明度在 RGBa 值中设置为 0，这意味着它将完全透明/不可见，需要将其设置为 1 才能可见。
此外，您需要将
RGBa值放在url('image.jpg')之前。Your alpha transparency is set to 0 in the
RGBavalues, this means that it will be completely transparent/not visible, this needs to be set to 1 for it to be visible.Also, you need to put your
RGBavalue before theurl('image.jpg').就像上一篇文章一样：颜色位于图像 url 之前。
你最好使用“透明”一词来代替 rgba(0,0,0,0)，因为这样会更好地兼容。
Like the previous post: color comes before image url.
in stead of rgba(0,0,0,0) you better use the word "transparent", as that would be better compatible.