Lesson 9 of 2045%

(Progress persistence is disabled until Phase 9)

Bootstrap
Beginner

Forms

Examples and usage guidelines for form control styles, layout options, and custom components.

Forms

Examples and usage guidelines for form control styles, layout options, and custom components.

Bootstrap provides powerful, pre-built components and utilities.

Example

<form>
  <div class="mb-3">
    <label for="exampleInputEmail1" class="form-label">Email address</label>
    <input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp">
    <div id="emailHelp" class="form-text">We'll never share your email with anyone else.</div>
  </div>
  <div class="mb-3">
    <label for="exampleInputPassword1" class="form-label">Password</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">Check me out</label>
  </div>
  <button type="submit" class="btn btn-primary">Submit</button>
</form>

Experiment with the code above in the Playground!

Lesson Progress

Practice This TopicTake QuizBuild a Bootstrap Project

Ready to practise?

Apply what you learned with a hands-on challenge.

Practise This Topic