## فــرم ساده

عنوان

    <div class="col-12 mb-3">
        <label for="exampleFormControlInput1" class="form-label">عنوان</label>
        <input type="text" class="form-control" id="exampleFormControlInput1" placeholder="">
    </div>

آدرس ایمیل
رمز عبور

    <div class="col-12 col-md-6 mb-3">
        <label for="exampleFormControlInput1" class="form-label">آدرس ایمیل</label>
        <input type="email" class="form-control" id="exampleFormControlInput1" placeholder="name@example.com">
    </div>
    <div class="col-12 col-md-6 mb-3">
        <label for="exampleFormControlInput1" class="form-label">رمز عبور</label>
        <input type="password" class="form-control" id="exampleFormControlInput1" placeholder="">
    </div>

توضـــیحات

    <div class="col-12 mb-3">
        <label for="exampleFormControlTextarea1" class="form-label">توضـــیحات</label>
        <textarea class="form-control" id="exampleFormControlTextarea1" rows="3"></textarea>
    </div>

نام شـــهر

    <div class="col-12 mb-3">
        <label for="exampleFormControlTextarea1" class="form-label">نام شـــهر</label>
        <select class="form-select" aria-label="Default select example">
            <option selected>نام شـــهر</option>
            <option value="1">تهران</option>
            <option value="2">اصفهان</option>
            <option value="3">اهواز</option>
        </select>
    </div>

علاقـــه مندی ها

    <div class="col-12 mb-3">
            <label for="exampleFormControlTextarea1" class="form-label">علاقـــه مندی ها</label>
            <select class="form-select" aria-label="Default select example" multiple>
                <option selected>آشپـــزی</option>
                <option value="1">نجــــاری</option>
                <option value="2">آهــــنگری</option>
                <option value="3">تــــعمیرات موبایل</option>
                <option value="3">تــــعمیرات کامپیوتر</option>
            </select>
    </div>

به کدام علاقـــه مند هستید ؟
خودرو
هواپیما
به کدام زبان علاقـــه مند هستید ؟
زبان شیرین فارسی
زبان تلخ آلمانی
انتخاب رنگ

    <!--form-check box-->
        <div class="col-12 col-md-4 mb-3">
            <label for="exampleFormControlTextarea1" class="form-label">به کدام علاقـــه مند هستید ؟</label>
            <div class="form-check">
                <input class="form-check-input" type="checkbox" value="" id="flexCheckDefault">
                <label class="form-check-label" for="flexCheckDefault">
                    خودرو
                </label>
            </div>
            <div class="form-check">
                <input class="form-check-input" type="checkbox" value="" id="flexCheckChecked" checked>
                <label class="form-check-label" for="flexCheckChecked">
                    هواپیما
                </label>
            </div>
        </div>
    <!--form-check radio-->
        <div class="col-12 col-md-4 mb-3">
            <label for="exampleFormControlTextarea1" class="form-label">به کدام زبان علاقـــه مند هستید ؟</label>
            <div class="form-check">
                <input class="form-check-input" type="radio" name="flexRadioDefault" id="flexRadioDefault1">
                <label class="form-check-label" for="flexRadioDefault1">
                    زبان شیرین فارسی
                </label>
            </div>
            <div class="form-check">
                <input class="form-check-input" type="radio" name="flexRadioDefault" id="flexRadioDefault2" checked>
                <label class="form-check-label" for="flexRadioDefault2">
                    زبان تلخ آلمانی
                </label>
            </div>
        </div>
    <!--form-control-color-->
        <div class="col-12 col-md-4 mb-3">
            <label for="exampleColorInput" class="form-label">انتخاب رنگ</label>
            <input type="color" class="w-100 form-control form-control-color" id="exampleColorInput" value="#563d7c" title="Choose your color">
        </div>

انتخاب محدوده 50

    <div class="col-12">
            <label for="customRange3" class="form-label">
                <span>انتخاب محدوده</span>
                <output class="ms-2" id="rangevalue">50</output>
            </label>
            <input type="range" class="form-range" min="0" max="100" step="1" id="customRange3" onchange="rangevalue.value=value">
    </div>