Toggle navigation
Bootsnipp
Bootstrap
For
CSS Frameworks
Bootstrap
Foundation
Semantic UI
Materialize
Pure
Bulma
References
CSS Reference
Tools
Community
Page Builder
Form Builder
Button Builder
Icon Search
Dan's Tools
Diff / Merge
Color Picker
Keyword Tool
Web Fonts
.htaccess Generator
Favicon Generator
Site Speed Test
Snippets
Featured
Tags
By Bootstrap Version
4.1.1
4.0.0
3.3.0
3.2.0
3.1.0
3.0.3
3.0.1
3.0.0
2.3.2
Register
Login
"Page 7"
Bootstrap 4.1.1 Snippet by
Alwx
4.1.1
Preview
HTML
View Full Screen
Fork
Fork this
3.8K
 
1 Fav
Post to Facebook
Tweet this
<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <!DOCTYPE html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="description" content=""> <meta name="author" content=""> <!-- Start: injected by Adguard --> <!-- End: injected by Adguard --> <link rel="icon" href="../../../../favicon.ico"> <title>Carousel Template for Bootstrap</title> <!-- Bootstrap core CSS --> <link href="../../css/editor.css" rel="stylesheet"> <!-- Custom styles for this template --> <link href="carousel.css" rel="stylesheet"> </head> <body><nav aria-label="Page navigation example" style="border: 1px dashed rgb(66, 133, 244);"> </nav> <header> <nav class="navbar navbar-expand-md navbar-dark bg-dark"> <a class="navbar-brand" href="#">Главная</a><a class="navbar-brand" href="#">Документы</a><a class="navbar-brand" href="#">Все платежи</a> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarCollapse"> <ul class="navbar-nav mr-auto"> <li class="nav-item active"> </li> <li class="nav-item"> </li> <li class="nav-item"> </li> </ul> <form class="form-inline mt-2 mt-md-0"> <input class="form-control mr-sm-2" type="text" placeholder="Search" aria-label="Search"> <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Выход</button> </form> </div> </nav> </header> <!-- Bootstrap core JavaScript ================================================== --> <!-- Placed at the end of the document so the pages load faster --> <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script> <script src="../../js/vendor/popper.min.js"></script> <script src="../../js/bootstrap.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/holderjs@2.9.4/holder.js"></script> <svg xmlns="http://www.w3.org/2000/svg" width="500" height="500" viewBox="0 0 500 500" preserveAspectRatio="none" style="display: none; visibility: hidden; position: absolute; top: -100%; left: -100%;"><defs><style type="text/css"></style></defs><text x="0" y="25" style="font-weight:bold;font-size:25pt;font-family:Arial, Helvetica, Open Sans, sans-serif">500x500</text></svg><div class="btn-group" role="group" aria-label="Basic example" style=""><button type="button" class="btn btn-secondary">Все</button><button type="button" class="btn btn-secondary">Новый</button> <button type="button" class="btn btn-secondary">В работе</button><button type="button" class="btn btn-secondary">Заблокированы</button><button type="button" class="btn btn-secondary">Готовый</button><button type="button" class="btn btn-secondary">Архивированный</button></div><table class="table" style=""> <thead> </thead> </table><nav aria-label="Page navigation example" style=""> </nav><table class="table" style=""> <thead> <tr> <th><label class="checkbox" style=""><input type="checkbox" style="text-align: center; float: left; top: auto; display: block; bottom: auto;"></label></th> <th>ID</th> <th> Фамилия</th> <th>Имя</th><th>Отчество</th><th>Статус</th><th>Срок действия визы(Дата окончания)</th> </tr> </thead> <tbody> <tr> <th scope="row"><label class="checkbox" style=""><input type="checkbox"> </label></th> <td>1</td> <td>Иванов</td> <td>Иван</td><td>Иванович</td><td>Активен</td><td>01.03.2020</td> </tr><tr> <th scope="row"><label class="checkbox" style=""><input type="checkbox"> </label></th> <td>2</td> <td>Иванов</td> <td>Иван</td><td>Иванович</td><td>Активен</td><td>01.03.2020</td> </tr><tr> <th scope="row"><label class="checkbox" style=""><input type="checkbox"> </label></th> <td>3</td> <td>Иванов</td> <td>Иван</td><td>Иванович</td><td>Активен</td><td>01.03.2020</td> </tr><tr> <th scope="row"><label class="checkbox" style=""><input type="checkbox"> </label></th> <td>4</td> <td>Иванов</td> <td>Иван</td><td>Иванович</td><td>Активен</td><td>01.03.2020</td> </tr><tr> <th scope="row"><label class="checkbox" style=""><input type="checkbox"> </label></th> <td>5</td> <td>Иванов</td> <td>Иван</td><td>Иванович</td><td>Активен</td><td>01.03.2020</td> </tr><tr> <th scope="row"><label class="checkbox" style=""><input type="checkbox"> </label></th> <td>6</td> <td>Иванов</td> <td>Иван</td><td>Иванович</td><td>Активен</td><td>01.03.2020</td> </tr><tr> <th scope="row"><label class="checkbox" style=""><input type="checkbox"> </label></th> <td>7</td> <td>Иванов</td> <td>Иван</td><td>Иванович</td><td>Активен</td><td>01.03.2020</td> </tr><tr> <th scope="row"><label class="checkbox" style=""><input type="checkbox"> </label></th> <td>8</td> <td>Иванов</td> <td>Иван</td><td>Иванович</td><td>Активен</td><td>01.03.2020</td> </tr><tr> <th scope="row"><label class="checkbox" style=""><input type="checkbox"> </label></th> <td>9</td> <td>Иванов</td> <td>Иван</td><td>Иванович</td><td>Активен</td><td>01.03.2020</td> </tr><tr> <th scope="row"><label class="checkbox" style=""><input type="checkbox"> </label></th> <td>10</td> <td>Иванов</td> <td>Иван</td><td>Иванович</td><td>Активен</td><td>01.03.2020</td> </tr><tr> <th scope="row"><label class="checkbox" style=""><input type="checkbox"> </label></th> <td>11</td> <td>Иванов</td> <td>Иван</td><td>Иванович</td><td>Активен</td><td>01.03.2020</td> </tr><tr> <th scope="row"><label class="checkbox" style=""><input type="checkbox"> </label></th> <td>12</td> <td>Иванов</td> <td>Иван</td><td>Иванович</td><td>Активен</td><td>01.03.2020</td> </tr><tr> <th scope="row"><label class="checkbox" style=""><input type="checkbox"> </label></th> <td>13</td> <td>Иванов</td> <td>Иван</td><td>Иванович</td><td>Активен</td><td>01.03.2020</td> </tr><tr> <th scope="row"><label class="checkbox" style=""><input type="checkbox"> </label></th> <td>14</td> <td>Иванов</td> <td>Иван</td><td>Иванович</td><td>Активен</td><td>01.03.2020</td> </tr><tr> <th scope="row"><label class="checkbox" style=""><input type="checkbox"> </label></th> <td>15</td> <td>Иванов</td> <td>Иван</td><td>Иванович</td><td>Активен</td><td>01.03.2020</td> </tr><tr> <th scope="row"><label class="checkbox" style=""><input type="checkbox"> </label></th> <td>16</td> <td>Иванов</td> <td>Иван</td><td>Иванович</td><td>Активен</td><td>01.03.2020</td> </tr><tr> <th scope="row"><label class="checkbox" style=""><input type="checkbox"> </label></th> <td>17</td> <td>Иванов</td> <td>Иван</td><td>Иванович</td><td>Активен</td><td>01.03.2020</td> </tr><tr> <th scope="row"><label class="checkbox" style=""><input type="checkbox"> </label></th> <td>18</td> <td>Иванов</td> <td>Иван</td><td>Иванович</td><td>Активен</td><td>01.03.2020</td> </tr><tr> <th scope="row"><label class="checkbox" style=""><input type="checkbox"> </label></th> <td>19</td> <td>Иванов</td> <td>Иван</td><td>Иванович</td><td>Активен</td><td>01.03.2020</td> </tr><tr> <th scope="row"><label class="checkbox" style=""><input type="checkbox"> </label></th> <td>20</td> <td>Иванов</td> <td>Иван</td><td>Иванович</td><td>Активен</td><td>01.03.2020</td> </tr> <tr> </tr> <tr> </tr> </tbody> </table><nav aria-label="Page navigation example" style=""> </nav><nav aria-label="Page navigation example" style=""> <ul class="pagination"> <li class="page-item"><a class="page-link" href="#">Previous</a></li> <li class="page-item"><a class="page-link" href="#">1</a></li> <li class="page-item"><a class="page-link" href="#">2</a></li> <li class="page-item"><a class="page-link" href="#">3</a></li> <li class="page-item"><a class="page-link" href="#">Next</a></li> </ul> </nav><div class="form-group" style=""><select class="form-control"><option value="value1">Text 1</option><option value="value2">Text 2</option><option value="value3">Text 3</option></select></div></body> </html>
Questions / Comments:
Post
Posting Guidelines
Formatting
- Now
×
Close
Donate
BTC: 12JxYMYi6Vt3mx3hcmP3B2oyFiCSF3FhYT
ETH: 0xCD715b2E3549c54A40e6ecAaFeB82138148a6c76