Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <html lang="en">
- <head>
- <title>Bootstrap Example</title>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
- </head>
- <body>
- <nav class="navbar fixed-top"style="background-color:skyblue;">
- <div class="col-md-7">
- <img src="http://portal.savonia.fi/img/amk/sisalto/_tutustu-savoniaan/viestintapalvelut/SAVONIA_logo+amk_rgb.jpg" style="width:150px;">
- <input type="text" placeholder="Username">
- <input type="password" placeholder="password">
- <button>Log in</button>
- </div>
- <div class="col-md-5">
- <ul class="nav navbar-nav navbar-right">
- <li class="active"><a href="#">Home</a></li>
- <li class="active"><a href="#">Wilma</a></li>
- <li class="active"><a href="#">Reppu</a></li>
- <li class="nav-item dropdown"></li>
- <li class="nav-item dropdown">
- <a href="#" class="nav-link dropdown toggle" id="navbarDropdown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" >Tools<span class="caret"></a>
- <div class="dropdown-menu" aria-labelledby="navbarDropdown">
- <a href="#" class="dropdown-item">Lunch</a>
- <a href="#" class="dropdown-item">Wilma</a>
- <div class="dropdown-divider"></div>
- <a href="#" class="dropdown-item">Reppu</a>
- </div>
- </li>
- </ul>
- </nav>
- <div class="container-fluid">
- <div class="row">
- <div class="col-md-5">
- <form>
- <div class="form-group">
- <label for="InputStudentNumber">Student Number</label>
- <input type="number" class="form-control" id="InputStudentNumber">
- <br>
- </div>
- <div class="form-group">
- <label for="inputStartYear">Start Year</label>
- <input type="number" class="form-control" id="inputStartYear">
- </div>
- <div class="form-check">
- <input type="checkbox" class="form-check-input" id="Check">
- <label class="form-check-label" for="Check">Remember Me</label>
- </div>
- <button type="submit" class="btn btn-primary">Check</button>
- </form>
- </div>
- <div class="col-md-7">
- <table class="table">
- <thead>
- <tr>
- <th scope="col">Course</th>
- <th scope="col">Date of Passing</th>
- <th scope="col">Grade</th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <th scope="row">Basics of Programming</th>
- <td>3.4.2019</td>
- <td>2/5</td>
- </tr>
- <tr>
- <th scope="row">Data structures and Algorithms</th>
- <td>16.2.2019</td>
- <td>5/5</td>
- </tr>
- <tr>
- <th scope="row">Mathematics 1</th>
- <td>28.1.2019</td>
- <td>4/5</td>
- </tr>
- <tr>
- <th scope="row">Mathematics 2</th>
- <td>11.9.2019</td>
- <td>4/5</td>
- </tr>
- <tr>
- <th scope="row">Physics 1</th>
- <td>28.11.2019</td>
- <td>4/5</td>
- </tr>
- </tbody>
- </table>
- </div>
- </div>
- </div>
- <script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>
- <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
- <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
- </body>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement