폼 요소

체크박스·라디오 입력 그룹

미리보기

@
.tabler.io
https:// .tabler.io

소스

<div class="mb-3">
    <label class="form-label">입력 그룹</label>
    <div class="input-group mb-2">
        <span class="input-group-text">
            @
        </span>
        <input type="text" class="form-control" placeholder="사용자명" autocomplete="off">
    </div>
    <div class="input-group mb-2">
        <input type="text" class="form-control" placeholder="서브도메인" autocomplete="off">
        <span class="input-group-text">
            .tabler.io
        </span>
    </div>
    <div class="input-group">
        <span class="input-group-text">
            https://
        </span>
        <input type="text" class="form-control" placeholder="서브도메인" autocomplete="off">
        <span class="input-group-text">
            .tabler.io
        </span>
    </div>
</div>

<div class="mb-3">
    <label class="form-label">체크박스 또는 라디오 버튼 입력</label>
    <div class="input-group mb-2">
        <span class="input-group-text">
            <input class="form-check-input m-0" type="checkbox" checked="">
        </span>
        <input type="text" class="form-control" autocomplete="off">
    </div>
    <div class="input-group">
        <input type="text" class="form-control" autocomplete="off">
        <span class="input-group-text">
            <input class="form-check-input m-0" type="radio" checked="">
        </span>
    </div>
</div>