Line 1: | Line 1: | ||
− | + | <!DOCTYPE html> | |
− | + | ||
<html> | <html> | ||
<head> | <head> | ||
− | + | ||
− | + | <meta charset="utf-8"> | |
− | + | <meta http-equiv="X-UA-Compatible" content="IE=edge"> | |
+ | <meta name="viewport" content="width=device-width, initial-scale=1"> | ||
+ | |||
+ | <title>Freebie: 4 Bootstrap Gallery Templates</title> | ||
+ | |||
+ | <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> | ||
+ | <link href="https://fonts.googleapis.com/css?family=Droid+Sans:400,700" rel="stylesheet"> | ||
+ | <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/baguettebox.js/1.8.1/baguetteBox.min.css"> | ||
+ | <link href="http://https://2017.igem.org/Team:ColumbiaNYC/Resources/CSS:safetystyle?action=raw&ctype=text/css" rel="stylesheet"> | ||
+ | |||
</head> | </head> | ||
+ | <body> | ||
− | < | + | <div class="container gallery-container"> |
− | + | <h1>Bootstrap 3 Gallery</h1> | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | <p class="page-description text-center">Thumbnails With Title And Description</p> | |
− | + | ||
<div class="tz-gallery"> | <div class="tz-gallery"> | ||
Line 27: | Line 29: | ||
<div class="col-sm-6 col-md-4"> | <div class="col-sm-6 col-md-4"> | ||
<div class="thumbnail"> | <div class="thumbnail"> | ||
− | <a class="lightbox" href=" | + | <a class="lightbox" href="../images/park.jpg"> |
− | <img src=" | + | <img src="../images/park.jpg" alt="Park"> |
</a> | </a> | ||
<div class="caption"> | <div class="caption"> | ||
<h3>Thumbnail label</h3> | <h3>Thumbnail label</h3> | ||
− | <p> | + | <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> |
</div> | </div> | ||
</div> | </div> | ||
Line 38: | Line 40: | ||
<div class="col-sm-6 col-md-4"> | <div class="col-sm-6 col-md-4"> | ||
<div class="thumbnail"> | <div class="thumbnail"> | ||
− | <a class="lightbox" href=" | + | <a class="lightbox" href="../images/bridge.jpg"> |
− | <img src=" | + | <img src="../images/bridge.jpg" alt="Bridge"> |
</a> | </a> | ||
<div class="caption"> | <div class="caption"> | ||
Line 49: | Line 51: | ||
<div class="col-sm-6 col-md-4"> | <div class="col-sm-6 col-md-4"> | ||
<div class="thumbnail"> | <div class="thumbnail"> | ||
− | <a class="lightbox" href=" | + | <a class="lightbox" href="../images/tunnel.jpg"> |
− | <img src=" | + | <img src="../images/tunnel.jpg" alt="Tunnel"> |
</a> | </a> | ||
<div class="caption"> | <div class="caption"> | ||
Line 60: | Line 62: | ||
<div class="col-sm-6 col-md-4"> | <div class="col-sm-6 col-md-4"> | ||
<div class="thumbnail"> | <div class="thumbnail"> | ||
− | <a class="lightbox" href=" | + | <a class="lightbox" href="../images/coast.jpg"> |
− | <img src=" | + | <img src="../images/coast.jpg" alt="Coast"> |
</a> | </a> | ||
<div class="caption"> | <div class="caption"> | ||
Line 71: | Line 73: | ||
<div class="col-sm-6 col-md-4"> | <div class="col-sm-6 col-md-4"> | ||
<div class="thumbnail"> | <div class="thumbnail"> | ||
− | <a class="lightbox" href=" | + | <a class="lightbox" href="../images/rails.jpg"> |
− | <img src=" | + | <img src="../images/rails.jpg" alt="Rails"> |
</a> | </a> | ||
<div class="caption"> | <div class="caption"> | ||
Line 82: | Line 84: | ||
<div class="col-sm-6 col-md-4"> | <div class="col-sm-6 col-md-4"> | ||
<div class="thumbnail"> | <div class="thumbnail"> | ||
− | <a class="lightbox" href=" | + | <a class="lightbox" href="../images/traffic.jpg"> |
− | <img src=" | + | <img src="../images/traffic.jpg" alt="Traffic"> |
</a> | </a> | ||
<div class="caption"> | <div class="caption"> | ||
Line 95: | Line 97: | ||
</div> | </div> | ||
− | + | </div> | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
+ | <script src="https://cdnjs.cloudflare.com/ajax/libs/baguettebox.js/1.8.1/baguetteBox.min.js"></script> | ||
+ | <script> | ||
+ | baguetteBox.run('.tz-gallery'); | ||
+ | </script> | ||
</body> | </body> | ||
− | |||
</html> | </html> | ||
− | |||
− |
Revision as of 03:57, 5 July 2017
<!DOCTYPE html>