رادیو
رادیو باکس پایه ای
<div class="form-group">
<label>رادیو باکس پیش فرض</label>
<div class="radio-list">
<label class="radio">
<input type="radio" name="radios1"/>
<span></span>
پیش فرض
</label>
<label class="radio radio-disabled">
<input type="radio" disabled="disabled" checked="checked" name="radios1"/>
<span></span>
غیرفعال
</label>
<label class="radio">
<input type="radio" checked="checked" name="radios1"/>
<span></span>
تیک خورده
</label>
</div>
</div>
<div class="form-group">
<label>رادیو خطی</label>
<div class="radio-inline">
<label class="radio">
<input type="radio" name="radios2"/>
<span></span>
گزینه 1
</label>
<label class="radio">
<input type="radio" name="radios2"/>
<span></span>
گزینه 2
</label>
<label class="radio">
<input type="radio" name="radios2"/>
<span></span>
گزینه 3
</label>
</div>
<span class="form-text text-muted">می توانید توضیحات در اینجا بنویسید</span>
</div>
<div class="form-group">
<label>رادیو خطی</label>
<div class="radio-inline">
<label class="radio">
<input type="radio" checked="checked" name="radios3"/>
<span></span>
گزینه 1
</label>
<label class="radio">
<input type="radio" name="radios3"/>
<span></span>
گزینه 2
</label>
<label class="radio">
<input type="radio" checked="checked" name="radios3"/>
<span></span>
گزینه 3
</label>
</div>
<span class="form-text text-muted">می توانید توضیحات در اینجا بنویسید</span>
</div>
<div class="form-group">
<label>اندازه بزرگ</label>
<div class="radio-inline">
<label class="radio radio-lg">
<input type="radio" checked="checked" name="radios3_1"/>
<span></span>
گزینه 1
</label>
<label class="radio radio-lg">
<input type="radio" name="radios3_1"/>
<span></span>
گزینه 2
</label>
<label class="radio radio-lg">
<input type="radio" name="radios3_1"/>
<span></span>
گزینه 3
</label>
</div>
<span class="form-text text-muted">می توانید توضیحات در اینجا بنویسید</span>
</div>
<div class="form-group">
<label>استایل مربع</label>
<div class="radio-inline">
<label class="radio radio-square">
<input type="radio" checked="checked" name="radios13_1"/>
<span></span>
گزینه 1
</label>
<label class="radio radio-square">
<input type="radio" name="radios13_1"/>
<span></span>
گزینه 2
</label>
<label class="radio radio-square">
<input type="radio" name="radios13_1"/>
<span></span>
گزینه 3
</label>
</div>
<span class="form-text text-muted">می توانید توضیحات در اینجا بنویسید</span>
</div>
<div class="form-group">
<label>استایل گوشه گرد</label>
<div class="radio-inline">
<label class="radio radio-rounded">
<input type="radio" checked="checked" name="radios15_1"/>
<span></span>
گزینه 1
</label>
<label class="radio radio-rounded">
<input type="radio" name="radios15_1"/>
<span></span>
گزینه 2
</label>
<label class="radio radio-rounded">
<input type="radio" name="radios15_1"/>
<span></span>
گزینه 3
</label>
</div>
<span class="form-text text-muted">می توانید توضیحات در اینجا بنویسید</span>
</div>
فرم افقی
<form class="form">
<div class="form-group row">
<label class="col-3 col-form-label">رادیو</label>
<div class="col-9 col-form-label">
<div class="radio-list">
<label class="radio">
<input type="radio" name="radios4"/>
<span></span>
پیش فرض
</label>
<label class="radio">
<input type="radio" checked="checked" name="radios4"/>
<span></span>
تیک خورده
</label>
<label class="radio radio-disabled">
<input type="radio" disabled="disabled" name="radios4"/>
<span></span>
غیرفعال
</label>
</div>
</div>
</div>
<div class="form-group row">
<label class="col-3 col-form-label">رادیو خطی</label>
<div class="col-9 col-form-label">
<div class="radio-inline">
<label class="radio">
<input type="radio" name="radios5"/>
<span></span>
گزینه 1
</label>
<label class="radio">
<input type="radio" name="radios5"/>
<span></span>
گزینه 2
</label>
<label class="radio">
<input type="radio" name="radios5"/>
<span></span>
گزینه 3
</label>
</div>
<span class="form-text text-muted">می توانید توضیحات در اینجا بنویسید</span>
</div>
</div>
<div class="form-group row">
<label class="col-3 col-form-label">رادیو خطی</label>
<div class="col-9 col-form-label">
<div class="radio-inline">
<label class="radio">
<input type="radio" name="radios6"/>
<span></span>
گزینه 1
</label>
<label class="radio">
<input type="radio" checked="checked" name="radios6"/>
<span></span>
گزینه 2
</label>
<label class="radio">
<input type="radio" name="radios6"/>
<span></span>
گزینه 3
</label>
</div>
<span class="form-text text-muted">می توانید توضیحات در اینجا بنویسید</span>
</div>
</div>
</form>
تم رنگی
<form class="form">
<div class="form-group row">
<label class="col-3 col-form-label">موفقیت</label>
<div class="col-9 col-form-label">
<div class="radio-inline">
<label class="radio radio-success">
<input type="radio" name="radios5"/>
<span></span>
پیش فرض
</label>
<label class="radio radio-success">
<input type="radio" name="radios5" checked="checked" />
<span></span>
تیک خورده
</label>
<label class="radio radio-success radio-disabled">
<input type="radio" name="radios5" disabled="disabled"/>
<span></span>
غیرفعال
</label>
</div>
<span class="form-text text-muted">می توانید توضیحات در اینجا بنویسید</span>
</div>
</div>
<div class="form-group row">
<label class="col-3 col-form-label">اصلی</label>
<div class="col-9 col-form-label">
<div class="radio-inline">
<label class="radio radio-primary">
<input type="radio" name="radios11"/>
<span></span>
پیش فرض
</label>
<label class="radio radio-primary">
<input type="radio" name="radios11" checked="checked" />
<span></span>
تیک خورده
</label>
<label class="radio radio-primary radio-disabled">
<input type="radio" name="radios11" disabled="disabled"/>
<span></span>
غیرفعال
</label>
</div>
<span class="form-text text-muted">می توانید توضیحات در اینجا بنویسید</span>
</div>
</div>
<div class="form-group row">
<label class="col-3 col-form-label">هشدار</label>
<div class="col-9 col-form-label">
<div class="radio-inline">
<label class="radio radio-danger">
<input type="radio" name="radios12"/>
<span></span>
پیش فرض
</label>
<label class="radio radio-danger">
<input type="radio" name="radios12" checked="checked" />
<span></span>
تیک خورده
</label>
<label class="radio radio-danger radio-disabled">
<input type="radio" name="radios12" disabled="disabled"/>
<span></span>
غیرفعال
</label>
</div>
<span class="form-text text-muted">می توانید توضیحات در اینجا بنویسید</span>
</div>
</div>
</form>
نوع خط دور
<form class="form">
<div class="form-group row">
<label class="col-3 col-form-label">خط دور پیش فرض</label>
<div class="col-9 col-form-label">
<div class="radio-inline">
<label class="radio radio-outline radio-success">
<input type="radio" name="radios15"/>
<span></span>
پیش فرض
</label>
<label class="radio radio-outline radio-success">
<input type="radio" name="radios15" checked="checked" />
<span></span>
تیک خورده
</label>
<label class="radio radio-outline radio-success radio-disabled">
<input type="radio" name="radios15" disabled="disabled"/>
<span></span>
غیرفعال
</label>
</div>
<span class="form-text text-muted">می توانید توضیحات در اینجا بنویسید</span>
</div>
</div>
<div class="form-group row">
<label class="col-3 col-form-label">خط دور ضخیم</label>
<div class="col-9 col-form-label">
<div class="radio-inline">
<label class="radio radio-outline radio-outline-2x radio-primary">
<input type="radio" name="radios16"/>
<span></span>
پیش فرض
</label>
<label class="radio radio-outline radio-outline-2x radio-primary">
<input type="radio" name="radios16" checked="checked" />
<span></span>
تیک خورده
</label>
<label class="radio radio-outline radio-outline-2x radio-primary radio-disabled">
<input type="radio" name="radios16" disabled="disabled"/>
<span></span>
غیرفعال
</label>
</div>
<span class="form-text text-muted">می توانید توضیحات در اینجا بنویسید</span>
</div>
</div>
</form>
نوع تاکید
<form class="form">
<div class="form-group row">
<label class="col-3 col-form-label">موفقیت</label>
<div class="col-9 col-form-label">
<div class="radio-inline">
<label class="radio radio-accent radio-success">
<input type="radio" name="radios18"/>
<span></span>
پیش فرض
</label>
<label class="radio radio-accent radio-success">
<input type="radio" name="radios18" checked="checked" />
<span></span>
تیک خورده
</label>
<label class="radio radio-accent radio-success radio-disabled">
<input type="radio" name="radios18" disabled="disabled"/>
<span></span>
غیرفعال
</label>
</div>
<span class="form-text text-muted">می توانید توضیحات در اینجا بنویسید</span>
</div>
</div>
<div class="form-group row">
<label class="col-3 col-form-label">هشدار</label>
<div class="col-9 col-form-label">
<div class="radio-inline">
<label class="radio radio-accent radio-danger">
<input type="radio" name="radios19"/>
<span></span>
پیش فرض
</label>
<label class="radio radio-accent radio-danger">
<input type="radio" name="radios19" checked="checked" />
<span></span>
تیک خورده
</label>
<label class="radio radio-accent radio-danger radio-disabled">
<input type="radio" name="radios19" disabled="disabled"/>
<span></span>
غیرفعال
</label>
</div>
<span class="form-text text-muted">می توانید توضیحات در اینجا بنویسید</span>
</div>
</div>
<div class="form-group row">
<label class="col-3 col-form-label">اصلی</label>
<div class="col-9 col-form-label">
<div class="radio-inline">
<label class="radio radio-accent radio-primary">
<input type="radio" name="radios20"/>
<span></span>
پیش فرض
</label>
<label class="radio radio-accent radio-primary">
<input type="radio" name="radios20" checked="checked" />
<span></span>
تیک خورده
</label>
<label class="radio radio-accent radio-primary radio-disabled">
<input type="radio" name="radios20" disabled="disabled"/>
<span></span>
غیرفعال
</label>
</div>
<span class="form-text text-muted">می توانید توضیحات در اینجا بنویسید</span>
</div>
</div>
</form>