0

こんにちは、 Web アプリケーションDropDownListでこのようなものを作成しようとしています。ASP.NET

ここに画像の説明を入力

select一部のデータが DropDownList に既にバインドされているため、タグを使用できません。基本的に、デフォルトの矢印ボタンを削除して、DropDownListこの画像を背景として追加しようとしています。を使用してこれを行う方法はありますCSS。これは私が使用したcssです

.drop-down-style
{
  width:150px;
  height:20px;
  border:solid 2px #a3a4a6;
  background-image:url('../Images/DropDownImage.gif');
}
4

2 に答える 2

2

このようなもの？

CSS:

.styled-select {
    width: 308px;
    height: 23px;
    overflow: hidden;
    background:url(arrow_xs.png) no-repeat 225px #FFF;
    border: 1px solid #ccc;
}
.styled-select select {
    background: transparent;
    width: 309px;
    padding-right: 4px;
    padding-bottom:7px;
    padding-left: 4px;
    padding-top: 0px;
    font-size: 12px;
    line-height: 1;
    border: none;
    border-radius: 0;
    height: 34px;
    -webkit-appearance: none;
}

HTML

<div class="styled-select">
    <select>
        <option>First option</option>
        <option>Second option</option>
    </select>
</div>

編集: 配置 (div) で矢印を追加できます。

編集 これをjsfiddleに入れました： http://jsfiddle.net/X4J3L/1/

于 2013-06-06T18:44:20.747 に答える
0

サードパーティのプラグインや jquery スクリプトを使用するのではなく、ajax ツールキットのコンボ ボックスを使用する必要があります。ここで例を見てください

コンボボックスの例

于 2013-06-10T06:03:47.503 に答える