2

要素のデザインを完全に変更するにはどうすればよいですか？私は次の画像のようにドロップダウンを作成しようとしています、私が書いたのは

<select>
 <option value="0">Title</option>
  <option value="1">Mrs</option>
  <option value="2">Mr</option>
</select>

ドロップダウンのドロップダウンリストを開くためのカスタム画像の配置と、選択した要素のスタイル設定方法に固執しています

ここに画像の説明を入力してください

4

2 に答える 2

1

一部のフォーム要素は、CSSだけでスタイルを設定するのが難しいことで有名ですが、それでもすべてのブラウザーで視覚的に同じように表示されます。

SELECT要素のスタイルを設定するための推奨される方法は、クロスブラウザーで機能するため、通常はjavascriptソリューションを使用することです。

これに関するChrisCoyleの記事をご覧ください：http： //css-tricks.com/dropdown-default-styling/

于 2013-01-29T10:49:33.583 に答える
1

説明したような要素のスタイルを設定することはできませんselect。背景色や境界線のようなものが可能です。

CSSを使用したスタイリングは、次のようになります。

select {
    border-radius: 5px;
    color: lightgrey;
    font-weight: bold;
}

このCSSを使用すると、角が丸くなり、フォントが変更されます。

不可能なこと：

  • アイコンを変更する
  • ドロップダウンボックスの背景またはフォントを変更します

javascript、ネストされたdivs、非表示のinputフィールドをいじってみてください。また、 http：//jqueryui.comを一目見ると非常に役立ちます。

于 2013-01-29T10:51:12.280 に答える