0

わかりましたので、ie8では問題なく見えますが、ie 7では正しく見えません。

以下のスタイルは、select div、select 要素そのものです。目盛りの代わりに画像が表示される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 に答える