0

好的,所以在 ie8 中它看起来不错,但是我无法让它在 ie 7 中看起来正确。

下面的样式是选择 div,即选择元素本身。我怎样才能让它看起来像 ie 8,其中图像而不是刻度是可见的。

选择投诉

…………

select {
border: 1px solid #D1DEE8;
width: 333px;
padding: 0 40px 0 10px;
font-size: 12px;
color: #666;
line-height: 15px;
-webkit-appearance: none;
-webkit-box-shadow: 1px 1px 1px #fff;
-webkit-border-radius: 0.5em;
-moz-appearance: none;
-moz-box-shadow: 1px 1px 1px #fff;
-moz-border-radius: 0.5em;
background: #fff url(../images/selectDrop.png) no-repeat right center;
height: 33px;

...........

.styled-select select {
background: rgba(0,0,0,0);
background: transparent;
width: 110%;
border: 0;
height: 32px;
float: left;
color: #666;
padding-top: 3px;

…………

.styled-select {
overflow: hidden;
float: left;
background: url(../images/DownArrow.png) white no-repeat 173px center;
border: 1px solid #ccc;
-webkit-border-radius: 7px;
-moz-border-radius: 7px;
-ms-border-radius: 7px;
-o-border-radius: 7px;
border-radius: 7px;
4

1 回答 1

2

不幸的是,目前还没有一种跨浏览器兼容的方式来使用 CSS 设置表单元素的样式:通常不让设计人员来控制它们的外观/行为,因此表单元素的样式是出了名的困难。许多浏览器根本不允许您设置它们的样式!

如果您需要在所有浏览器中获得一致的外观,唯一的方法是使用 JavaScript 将视图中的表单元素替换为风格化的 HTML 元素。

这是一篇文章,列出了一些可供您使用的选项:http ://www.jquery4u.com/plugins/10-jquery-selectboxdrop-down-plugins/

于 2013-05-30T09:36:37.707 回答