Skip to content

Instantly share code, notes, and snippets.

@joel-extremo

joel-extremo/index.html

Last active August 30, 2018 22:51
Show Gist options
  • Save joel-extremo/5f4ed3d2a802641006c86b7b54e6dc36 to your computer and use it in GitHub Desktop.
Save joel-extremo/5f4ed3d2a802641006c86b7b54e6dc36 to your computer and use it in GitHub Desktop.
Download ZIP
2.1: Semantic HTML & Footers
Raw
index.html
<!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">
<title>Portfolio</title>
<!-- Social Media -->
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
<!-- Bootstrap core CSS -->
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/all.css" integrity="sha384-hWVjflwFxL6sNzntih27bfxkr27PmbbK/iSvJ+a4+0owXq79v+lsFkW54bOGbiDQ" crossorigin="anonymous">
<link href="https://fonts.googleapis.com/css?family=Quicksand" rel="stylesheet">
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/styles.css">
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-dark bg-dark navbar-custom">
<a class="navbar-brand" href="#">CareerFoundry</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav ml-auto xm-mx-auto">
<li class="nav-item">
<a class="nav-link" href="#video">video</a>
</li>
</ul>
</div>
</nav><!-- end navbar -->
<div class="container">
<section id="video">
<h1 class="text-center">Video</h1>
<div class="embed-responsive embed-responsive-16by9">
<iframe class="embed-responsive-item" src="https://www.youtube.com/embed/O7w7xp9q71w" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
</div>
</section><!-- end video -->
</div><!-- end container -->
<footer>
<div class="row">
<div class="col-sm">
<div class="social-media-container">
<a href="https://twitter.com/jmrv002?ref_src=twsrc%5Etfw" class="twitter-follow-button" data-show-count="true">Follow @jmrv002</a>
</div>
<div class="social-media-container">
<iframe src="https://www.facebook.com/plugins/like.php?href=https%3A%2F%2Fwww.facebook.com%2FUniversidadAPEC.UNAPEC%2F&width=200&layout=standard&action=like&size=small&show_faces=true&share=true&height=80&appId=317854238964944" width="400" height="80" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true" allow="encrypted-media"></iframe>
</div>
</div>
<div class="col-sm">
<div id="copyright">Copyright <span>&copy;</span> All Rights Reserved</div>
</div>
</div>
</footer>
<!-- Javascript -->
<script src="js/jquery-3.3.1.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/main.js"></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment