You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
148 lines
5.9 KiB
148 lines
5.9 KiB
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Document</title>
|
|
<link rel="stylesheet" href="css/bootstrap.css">
|
|
</head>
|
|
<body>
|
|
|
|
<nav class="navbar navbar-expand-sm bg-dark navbar-dark fixed-top">
|
|
<div class="container-fluid">
|
|
<a href="#" class="navbar-brand">
|
|
<img src="logo.png" alt="LOGO" style="width: 40px;">
|
|
</a>
|
|
<ul class="navbar-nav">
|
|
<li class="nav-item"><a href="" class="nav-link">HP</a></li>
|
|
<li class="nav-item"><a href="" class="nav-link">Lenovo</a></li>
|
|
<li class="nav-item"><a href="" class="nav-link">IBM</a></li>
|
|
<li class="nav-item"><a href="" class="nav-link">ASUS</a></li>
|
|
<li class="nav-item"><a href="" class="nav-link">GIGABYTE</a></li>
|
|
</ul>
|
|
</div>
|
|
</nav>
|
|
<div class="m-5 text-white">BAF</div>
|
|
<div class="container mt-5">
|
|
<h1>Tabulky</h1>
|
|
|
|
<table class="table table-hover table-primary">
|
|
<tr class="table-dark">
|
|
<th>ID</th>
|
|
<th>Name</th>
|
|
<th>Contact</th>
|
|
</tr>
|
|
<tr class="table-primary">
|
|
<td >asd</td>
|
|
<td>qwe</td>
|
|
<td>yxc</td>
|
|
</tr>
|
|
<tr class="table-danger">
|
|
<td>ERROR</td>
|
|
<td>asd</td>
|
|
<td>qwe</td>
|
|
</tr>
|
|
<tr class="table-info">
|
|
<td>qwe</td>
|
|
<td>yxc</td>
|
|
<td>asd</td>
|
|
</tr>
|
|
<tr class="table-success">
|
|
<td>asd</td>
|
|
<td>qwe</td>
|
|
<td>yxc</td>
|
|
</tr>
|
|
<tr class="table-active">
|
|
<td>yxc</td>
|
|
<td>asd</td>
|
|
<td>qwe</td>
|
|
</tr>
|
|
<tr class="table-light">
|
|
<td>qwe</td>
|
|
<td>yxc</td>
|
|
<td>asd</td>
|
|
</tr>
|
|
<tr class="table-dark">
|
|
<td>asd</td>
|
|
<td>qwe</td>
|
|
<td>yxc</td>
|
|
</tr>
|
|
<tr>
|
|
<td>yxc</td>
|
|
<td>asd</td>
|
|
<td>qwe</td>
|
|
</tr>
|
|
<tr>
|
|
<td>qwe</td>
|
|
<td>yxc</td>
|
|
<td>asd</td>
|
|
</tr>
|
|
</table>
|
|
|
|
|
|
<hr>
|
|
<h1>Alert v BS</h1>
|
|
<div class="alert alert-primary alert-dismissible show fade">
|
|
<button class="btn-close"
|
|
data-bs-dismiss="alert"></button>
|
|
<strong>Lorem ipsum</strong> dolor sit amet consectetur adipisicing elit. Iure recusandae ullam consectetur rerum voluptatum porro, illum, perferendis veniam architecto debitis eveniet vero aut voluptatem est animi in nam quasi possimus?
|
|
</div>
|
|
<div class="alert alert-warning alert-dismissible show fade">
|
|
<button class="btn-close"
|
|
data-bs-dismiss="alert"></button>
|
|
<strong>Lorem ipsum</strong> dolor sit amet consectetur adipisicing elit. Iure recusandae ullam consectetur rerum voluptatum porro, illum, perferendis veniam architecto debitis eveniet vero aut voluptatem est animi in nam quasi possimus?
|
|
</div>
|
|
<div class="alert alert-secondary alert-dismissible">
|
|
<button class="btn-close"
|
|
data-bs-dismiss="alert"></button>
|
|
<strong>Lorem ipsum</strong> dolor sit amet consectetur adipisicing elit. Iure recusandae ullam consectetur rerum voluptatum porro, illum, perferendis veniam architecto debitis eveniet vero aut voluptatem est animi in nam quasi possimus?
|
|
</div>
|
|
<div class="alert alert-info alert-dismissible">
|
|
<button class="btn-close"
|
|
data-bs-dismiss="alert"></button>
|
|
<strong>Lorem ipsum</strong> dolor sit amet consectetur adipisicing elit. Iure recusandae ullam consectetur rerum voluptatum porro, illum, perferendis veniam architecto debitis eveniet vero aut voluptatem est animi in nam quasi possimus?
|
|
</div>
|
|
|
|
<hr>
|
|
<h1>Nav</h1>
|
|
<ul class="nav nav-pills nav-justified justify-content-center">
|
|
<li class="nav-item">
|
|
<a class="nav-link " href="">DOM</a></li>
|
|
<li class="nav-item">
|
|
<a class="nav-link disabled" href="">LOM</a></li>
|
|
<li class="nav-item">
|
|
<a class="nav-link active" href="">STROP</a></li>
|
|
<li class="nav-item">
|
|
<a class="nav-link " href="">TOP</a></li>
|
|
</ul>
|
|
<ul class="nav nav-tabs nav-justified justify-content-center">
|
|
<li class="nav-item">
|
|
<a class="nav-link " href="">DOM</a></li>
|
|
<li class="nav-item">
|
|
<a class="nav-link active" href="">LOM</a></li>
|
|
<li class="nav-item">
|
|
<a class="nav-link disabled " href="">STROP</a></li>
|
|
<li class="nav-item">
|
|
<a class="nav-link " href="">TOP</a></li>
|
|
</ul>
|
|
|
|
|
|
<hr>
|
|
<h1>Jumbotron</h1>
|
|
|
|
<div class="mt-4 p-5 bg-secondary text-white rounded">
|
|
<h1 class="display-1"> Hello World!</h1>
|
|
<p> Lorem ipsum dolor sit amet consectetur adipisicing elit. Totam tenetur officiis quas exercitationem quia officia delectus voluptas reiciendis expedita? Animi error sapiente consectetur expedita sunt iste corrupti eligendi accusamus odio.</p>
|
|
<hr>
|
|
<a href="#" class="btn btn-primary">TEST</a>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div style="height: 200px; width: 200px;"></div>
|
|
<script src="js/bootstrap.js"></script>
|
|
</body>
|
|
</html>
|