Products

Data Converter Cleaner TUC - Unit Converter Import Export Survey Manager Tweet Controller

Developer

Article Blog Forum Interview Beginner News Startup Quiz

Users

Career

Apply Job Internship

Pricing

Login Sign Up Get a Quote

Basic form with the help of Bootstrap classes

Ethan Karla 380 28 Jul 2021

How to create a basic form with the help of Bootstrap classes?

Ask by Ethan Karla

Updated 28 Jul 2021

1 Answers

Anonymous User 03 Aug 2021

To make a Basic form with the help of an Bootstrap classes see the below example:

<html lang='en'>

<head>

    <meta charset='utf-8'>

    <meta name='viewport' content='width=device-width, initial-scale=1, shrink-to-fit=no'>

    <title>Bootstrap Dropdown</title>

    <link href='https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css' rel='stylesheet' integrity='sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC' crossorigin='anonymous'>

    <script src='https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js' integrity='sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM' crossorigin='anonymous'></script>

</head>

<body>

    <div class='container d-flex justify-content-center flex-column'>

        <form action=''>

            <div class='form-group my-3'>

                <label for='email'>Email ID</label>

                <input type='email' class='form-control' placeholder='Enter email' id='email'>

            </div>

            <div class='form-group my-3'>

                <label for='pwd'>Password:</label>

                <input type='password' class='form-control' placeholder='Enter password' id='pwd'>

            </div>

            <div class='form-group form-check my-3'>

                <label class='form-check-label'>

                    <input class='form-check-input' type='checkbox'>

                    Remember me

                </label>

            </div>

            <button type='submit' class='btn btn-outline-primary'>Submit</button>

        </form>

    </div>

</body>

</html>

Hope this will help you.

Happy Coding!

MindStick Training

Markdown for AI

A clean, structured version of this page for AI assistants and LLMs.