0

この煩わしい矢印の代わりに画像を使用してカスタム ドロップダウンを作成したいので、このフォーラムで誰かが select を小さな div でラップすることを提案しました。したがって、すべてが機能します。問題は選択にあります。

オプションを選択すると、選択した要素を示す青い背景の強調表示がわかり、問題は、要素が選択されている場合でも、この強調表示が画像の矢印に重なったままになることです。

どうすればこれを解決できますか

選択オプションを使用しようとしましたが、何も起こりません!

.styled-select select option ::selection {
       background:#fff;

}

これが私のコードです： HTML

        <div class="styled-select">
       <select>
          <option>Here is the first option</option>
          <option>The second option</option>
       </select>
        </div>

CSS:-

    .styled-select select {
       background: transparent;
       width: 268px;
       padding: 5px;
        border: 0;
       border-radius: 0;
       height: 34px;
       line-height: 1;
       -webkit-appearance: none;
       }

    .styled-select {
       width: 240px;
       height: 34px;
       overflow: hidden;
       background: url(file:///C:/Users/gismo2/Pictures/fancy_nav_down.jpg) no-repeat right  ;
        border: 1px solid #ccc;
       }
4

1 に答える 1

0

ドロップダウンのスタイルを設定したい場合は、次のようなプラグインを使用することをお勧めします： Jquery Selectbox

このドロップダウンでは、ニーズに合わせてスタイルを設定できます。

于 2013-02-28T12:41:52.490 に答える