Difference between revisions of "Team:ColumbiaNYC/Safety"
| 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>
Bootstrap 3 Gallery
Thumbnails With Title And Description
Thumbnail label
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Thumbnail label
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Thumbnail label
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Thumbnail label
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Thumbnail label
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Thumbnail label
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
