ورودی‌ها

<div class="row gy-3">
    <div class="col-xl-12">
        <label for="input-noradius" class="form-label">ورودی بدون شعاع</label>
        <input type="text" class="form-control rounded-0" id="input-noradius" placeholder="بدون شعاع">
    </div>
    <div class="col-xl-12">
        <label for="input-rounded" class="form-label">ورودی با شعاع</label>
        <input type="text" class="form-control" id="input-rounded" placeholder="شعاع پیش فرض">
    </div>
    <div class="col-xl-12">
        <label for="input-rounded-pill" class="form-label">ورودی گرد</label>
        <input type="text" class="form-control rounded-pill" id="input-rounded-pill" placeholder="گرد شده">
    </div>
</div>

<div class="row gy-3">
    <div class="col-xl-12">
        <label for="input-rounded1" class="form-label">پیش‌فرض</label>
        <input type="text" class="form-control" id="input-rounded1" placeholder="پیش‌فرض">
    </div>
    <div class="col-xl-12">
        <label for="input-rounded2" class="form-label">ورودی نقطه‌چین</label>
        <input type="text" class="form-control border-dotted" id="input-rounded2" placeholder="نقطه‌چین">
    </div>
    <div class="col-xl-12">
        <label for="input-rounded3" class="form-label">ورودی خط‌چین</label>
        <input type="text" class="form-control border-dashed" id="input-rounded3" placeholder="خط‌چین">
    </div>
</div>

<div class="row gy-4">
    <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
        <p class="mb-2 text-muted">ورودی پایه:</p>
        <input type="text" class="form-control" id="input">
    </div>
    <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
        <label for="input-label" class="form-label">فرم ورودی با برچسب</label>
        <input type="text" class="form-control" id="input-label">
    </div>
    <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
        <label for="input-placeholder" class="form-label">ورودی فرم با متغیر مکان</label>
        <input type="text" class="form-control" id="input-placeholder" placeholder="وزودی">
    </div>
    <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
        <label for="input-text" class="form-label">متن را تایپ کنید</label>
        <input type="text" class="form-control" id="input-text" placeholder="متن">
    </div>
    <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
        <label for="input-number" class="form-label">شماره را تایپ کنید</label>
        <input type="number" class="form-control" id="input-number" placeholder="شماره">
    </div>
    <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
        <label for="input-password" class="form-label">رمزعبور را تایپ کنید</label>
        <input type="password" class="form-control" id="input-password" placeholder="رمزعبور">
    </div>
    <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
        <label for="input-email" class="form-label">ایمیل را تایپ کنید</label>
        <input type="email" class="form-control" id="input-email" placeholder="Email@xyz.com">
    </div>
    <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
        <label for="input-tel" class="form-label">تلفن را تایپ کنید</label>
        <input type="tel" class="form-control" id="input-tel" placeholder="0912123456">
    </div>
    <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
        <label for="input-search" class="form-label">جستحو را تایپ کنید</label>
        <input type="search" class="form-control" id="input-search" placeholder="جستجو">
    </div>
    <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
        <label for="input-submit" class="form-label">تایید را تایپ کنید</label>
        <input type="submit" class="form-control" id="input-submit" value="تایید">
    </div>
    <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
        <label for="input-reset" class="form-label">تنظیم مجدد را تایپ کنید</label>
        <input type="reset" class="form-control" id="input-reset">
    </div>
    <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
        <label for="input-button" class="form-label">دکمه تایپ</label>
        <input type="button" class="form-control btn btn-primary" id="input-button"  value="دکمه">
    </div>
    <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
        <div class="row">
            <div class="col-xl-4">
                <label class="form-label">رنگ را تایپ کنید</label>
                <input class="form-control form-input-color" type="color" value="#136bd0">
            </div>
            <div class="col-xl-4">
                <div class="form-check">
                    <p class="mb-3 px-0 text-muted">Checkbox را تایپ کنید</p>
                    <input class="form-check-input ms-2" type="checkbox" value="" checked="">
                </div>
            </div>
            <div class="col-xl-3">
                <div class="form-check">
                    <p class="mb-3 px-0 text-muted">radio را تایپ کنید</p>
                    <input class="form-check-input ms-2" type="radio" checked="">
                </div>
            </div>
        </div>
    </div>
    <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
        <label for="input-file" class="form-label">فایل را تایپ کنید</label>
        <input class="form-control" type="file" id="input-file">
    </div>
    <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
        <label class="form-label">URL را تایپ کنید</label>
        <input class="form-control" type="url"  name="website" placeholder="http://example.com">
    </div>
    <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
        <label for="input-disabled" class="form-label">Disabled را تایپ کنید</label>
        <input type="text" id="input-disabled" class="form-control" placeholder="Disabled را تایپ کنید" disabled="">
    </div>
    <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
        <label for="input-readonlytext" class="form-label">متن فقط خواندنی را وارد کنید</label>
        <input type="text" readonly="" class="form-control-plaintext" id="input-readonlytext" value="email@example.com">
    </div>
    <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
        <label for="disabled-readonlytext" class="form-label">ورودی فقط خواندنی غیرفعال است</label>
        <input class="form-control" type="text" value="Disabled readonly input" id="disabled-readonlytext" aria-label="ورودی فقط خواندنی غیرفعال است" disabled="" readonly="">
    </div>
    <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
        <label class="form-label">ورودی فقط خواندنی را تایپ کنید</label>
        <input class="form-control" type="text" value="ورودی فقط خواندنی را تایپ کنید" aria-label="readonly input example" readonly="">
    </div>
    <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
        <label for="text-area" class="form-label">Textarea</label>
        <textarea class="form-control" id="text-area" rows="1"></textarea>
    </div>
    <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
        <label for="input-DataList" class="form-label">نمونه Datalist</label>
        <input class="form-control" list="datalistOptions" id="input-DataList" placeholder="برای جستجو تایپ کنید...">
        <datalist id="datalistOptions">
            <option value="سان فرانسیسکو">
            </option>
            <option value="نیویورک">
            </option>
            <option value="سیاتل">
            </option>
            <option value="">لس انجلس
            </option>
            <option value="شیکاگو">
            </option>
        </datalist>
    </div>
</div>

<input class="form-control form-control-sm mb-3" type="text"
placeholder=".form-control-sm" aria-label=".form-control-sm example">
<input class="form-control mb-3" type="text" placeholder="ورودی پیش فرض"
    aria-label="مثال ورودی پیش فرض">
<input class="form-control form-control-lg" type="text"
placeholder=".form-control-lg" aria-label=".form-control-lg example">

<form>
    <div class="mb-3">
        <label for="exampleInputEmail1" class="form-label">آدرس ایمیل</label>
        <input type="email" class="form-control" id="exampleInputEmail1"
            aria-describedby="emailHelp">
        <div id="emailHelp" class="form-text">ما خواهیم کرد
            هرگز ایمیل خود را به اشتراک نگذارید
            با
            هر کس دیگری</div>
    </div>
    <div class="mb-3">
        <label for="exampleInputPassword1" class="form-label">رمزعبور</label>
        <input type="password" class="form-control" id="exampleInputPassword1">
    </div>
    <div class="mb-3 form-check">
        <input type="checkbox" class="form-check-input" id="exampleCheck1">
        <label class="form-check-label" for="exampleCheck1">بررسی کنید
            من بیرون</label>
    </div>
    <button type="submit" class="btn btn-primary">ارسال</button>
</form>

<form>
    <fieldset disabled="">
        <legend>نمونه مجموعه فیلد غیرفعال</legend>
        <div class="mb-3">
            <label for="disabledTextInput" class="form-label">از کار افتاده است
                ورودی</label>
            <input type="text" id="disabledTextInput" class="form-control"
                placeholder="از کار افتاده است
                ورودی">
        </div>
        <div class="mb-3">
            <label for="disabledSelect" class="form-label">غیرفعال انتخاب کنید
                منو</label>
            <select id="disabledSelect" class="form-select">
                <option>غیرفعال انتخاب کنید</option>
            </select>
        </div>
        <div class="mb-3">
            <div class="form-check">
                <input class="form-check-input" type="checkbox"
                    id="disabledFieldsetCheck" disabled="">
                <label class="form-check-label" for="disabledFieldsetCheck">
                   نمی توان این را بررسی کرد
                </label>
            </div>
        </div>
        <button type="submit" class="btn btn-primary">ارسال</button>
    </fieldset>
</form>