0

次のページがあります。

ここに画像の説明を入力

フォームのコードは次のようになります。

    <div class="container">
  <div class="row">
    <div class="offset3 span3">

      <form class="form-horizontal" id="inputForm">
      <div class="control-group">
        <label class="control-label" for="volume">Beer Volume</label>
        <div class="controls">
          <div class="input-append">
            <input type="text" id="volume" placeholder="i.e. 16">
            <span class="add-on">oz</span>
          </div>
        </div>
      </div>
      <div class="control-group">
        <label class="control-label" for="alcPercent">Alcohol</label>
        <div class="controls">
          <div class="input-append">
            <input type="text" id="alcPercent" placeholder="i.e. 6.3">
            <span class="add-on">%</span>
          </div>
        </div>
      </div>
      <div class="control-group">
        <div class="controls">
          <button class="btn-large" type="button" value="CONVERT" onclick="onSubmit()">CONVERT</button>
        </div>
    </div>
  </form>

「オンス」が実際にドロップダウンメニューになり、ユーザーが「オンス」、「センチリットル」、「リットル」などから選択できるようにページを作成しようとしています。これをきれいに行う方法はありますかブートストラップ? 「ボタン ドロップダウン」があるのがわかります: http://twitter.github.io/bootstrap/base-css.html#formsですが、そのコードをコピーすると、ドロップダウンの選択肢が機能しませんでした。

これどうやってするの？

4

2 に答える 2

7

ここでも同じ問題。js などで基本を修正するのは嫌いです。これが私の修正です:) :)

戦利品プレビュー

<div class="form-group">
    <label for="input" class="col-sm-2 control-label">Budget</label>
    <div class="col-sm-10">
        <div class="input-group">
            <select class="form-control" style="float: left;width: initial;">
                <option>&euro;</option>
                <option>&dollar;</option>
            </select>
            <input type="text" class="form-control" style="float: left;width: initial;">
            <select class="form-control" style="float: left;width: initial;">
                <option>per job</option>
                <option>per hour</option>
            </select>
        </div>
    </div>
</div>
于 2014-11-29T15:55:13.453 に答える