3

これが私のブートストラップコードです

 <div class="input-append" align="center" > 
           <input type="text" name="q" class="span2 search-query" placeholder="Snipp or Tag"/> 

           <button type="submit" class="btn">Search</button> 

        </div>

これがjsfiddleです

Search検索ボックスと検索ボタンを結合し、ボタンの右側をカーブさせる方法はありますか？

4

2 に答える 2

3

border-radius検索ボタンのを制御する css クラスは.form-search .input-append .btn. そのクラスを適用するには、そのクラスで div を囲むフォームまたは div を追加しinput-appendます。

このような：

<div class="form-search">
 <div class="input-append"> 
  <input type="text" name="q" class="span2 search-query" placeholder="Snipp or Tag"/><button type="submit" class="btn">Search</button> 
 </div>
</div>

ここにドキュメントへのリンクがあり、ここにあなたのjsFiddleへの更新があります。

于 2013-01-23T14:56:00.663 に答える
0

これを追加するだけです。

input.search-query {
    -moz-border-top-right-radius: 0;
    -webkit-border-top-right-radius: 0;
    border-top-right-radius: 0;

    -moz-border-bottom-right-radius: 0;
    -webkit-border-bottom-right-radius: 0;
    border-bottom-right-radius: 0;
}
于 2013-01-23T14:50:01.293 に答える