Bootstrap【個人用ドキュメント】

offsetクラス

md以上の時、4列分右に動かす。

offset-md-4

表示/非表示

sm以上の時に表示する。それ以下は非表示。

.d-none .d-sm-block

overflow

.overflow-hiddens

Forms

インプット/チェックボックスの書き方

<form class="form">
    <div class="form-group">
        <!-- input要素のrequired属性は、その入力項目が必須属性であることをブラウザに知らせることができます。HTML5では、required属性を設定するだけでJavaScriptによる入力チェックがなくてもエラーメッセージを表示させることが可能です。 -->
        <input type="email" name="userEmail" class="form-control" placeholder="Email" required>
    </div>
    <div class="form-group">
        <input type="text" name="userFirstName" class="form-control" placeholder="First name" required>
    </div>
    <div class="form-group">
        <input type="text" name="userLastName" class="form-control" placeholder="Last name" required>
    </div>
    <div class="form-group">
        <input type="number" class="form-control" name="userFirstDeposit" aria-describedby="emailHelp" placeholder="Enter your first deposit" required>
    </div>
    <div class="form-group">
        <div class="form-check">
            <!-- チェックボックスをあらかじめチェックするにはchecked属性を使用します。 -->
            <input class="form-check-input" type="radio" name="userAccountType" id="userAccountType1" value="savings" checked required>
            <label class="form-check-label" for="userAccountType1">
                            Savings
            </label>
        </div>
        <div class="form-check">
           <input class="form-check-input" type="radio" name="userAccountType" id="userAccountType2" value="checkings" required>
           <label class="form-check-label" for="userAccountType2">
                            Checkings
           </label>
        </div>
    </div>
    <button type="submit" class="btn btn-primary col-12">Submit</button>
</form>