0

Bootstrapv2.0.2を使用しています。以下は、自分のWebサイト用に作成しているナビゲーションバーです。

ここに画像の説明を入力してください 検索は3つのフィールドで構成されています

1) Combo box or any drop down 
2) search input text field 
3) Search icon ( click-able )

。これが上のスクリーンショットのフィドルです（Firefoxで開いてください）

http://jsfiddle.net/krg78/1/

コンボボックスをテキスト入力の一部のように見せて（2つは異なるフィールドに見えるようになりました）、Search2の代わりにクリック可能な検索アイコンを表示する方法はありますか（Facebookのように）？

以下の行を使用すると、アイコンの代わりに空白のフィールドが表示されます。

<span class='add-on' style="float: right"> <i class="icon-search"></i> </span>

皆さん、ありがとうございました

4

1 に答える 1

1

http://jsfiddle.net/krg78/2/を確認してください

コンボボックスに相対的な位置を追加して入力に移動することにより、コンボボックスをテキスト入力の一部のように見せることができます。

.navbar-search select {
  position: relative;
  left: 84px;
}

.navbar-search input {
  padding-left: 84px;
}
于 2012-10-22T10:27:57.967 に答える