| <!doctype html> |
| <html lang="en"> |
| <head> |
| <meta charset="utf-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1"> |
| <link href="../../../dist/css/bootstrap.min.css" rel="stylesheet"> |
| <title>Form</title> |
| <style></style> |
| </head> |
| <body> |
| <div class="container"> |
| <h1>Input <small>Bootstrap Visual Test</small></h1> |
| |
| <h2>No layout</h2> |
| |
| <div class="mb-3"> |
| Text |
| <input class="form-control"> |
| </div> |
| <div class="mb-3"> |
| Email |
| <input type="email" class="form-control"> |
| </div> |
| <div class="mb-3"> |
| Number |
| <input type="number" class="form-control"> |
| </div> |
| <div class="mb-3"> |
| Date |
| <input type="date" class="form-control"> |
| </div> |
| |
| <h2>Flex</h2> |
| |
| <div class="d-flex flex-wrap gap-3 mb-3"> |
| <div> |
| Text |
| <input class="form-control"> |
| </div> |
| <div> |
| Email |
| <input type="email" class="form-control"> |
| </div> |
| <div> |
| Number |
| <input type="number" class="form-control"> |
| </div> |
| <div> |
| Date |
| <input type="date" class="form-control"> |
| </div> |
| </div> |
| |
| <h2>Grid</h2> |
| |
| <div class="row mb-3"> |
| <div class="col"> |
| Text |
| <input class="form-control"> |
| </div> |
| <div class="col"> |
| Email |
| <input type="email" class="form-control"> |
| </div> |
| <div class="col"> |
| Number |
| <input type="number" class="form-control"> |
| </div> |
| <div class="col"> |
| Date |
| <input type="date" class="form-control"> |
| </div> |
| </div> |
| </div> |
| |
| <script src="../../../dist/js/bootstrap.bundle.js"></script> |
| </body> |
| </html> |