Skip to content

Instantly share code, notes, and snippets.

@DragonOsman

DragonOsman/index.html

Last active December 20, 2017 21:41
Show Gist options
  • Save DragonOsman/edd7b7cb517431d4b3e72a9070a17d76 to your computer and use it in GitHub Desktop.
Save DragonOsman/edd7b7cb517431d4b3e72a9070a17d76 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
index.html
<!DOCTYPE html>
<html lang="en-us">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,
height=device-height, initial-scale=1.0" />
<meta name="author" content="Osman Zakir" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="stylesheet" type="text/css"
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"
integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" />
<link rel="stylesheet" type="text/css" href="styles/styles.css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"
integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa"
crossorigin="anonymous"></script>
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<title>Osman Zakir Software-Web Workshop</title>
</head>
<body class="container-fluid">
<header class="jumbotron row">
<h1>Osman Zakir Software-Web Workshop</h1>
<nav class="navbar navbar-expand-md">
<ul class="nav-justified">
<li><a href="#">About Me</a></li>
<li><a href="#">Portfolio</a></li>
<li><a href="#">My Favorites</a></li>
</ul>
<div>Logo (the background image)
made with <a href="https://www.designevo.com/" title="Free Online Logo Maker">DesignEvo</a></div>
</nav>
</header>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<main class="container-fluid">
<div class="row text-center">
<img class="col-md-3 img-responsive" src="/images/me.jpg" width="157" height="201" alt="A picture of me" />
<p class="col-md-9">Welcome to my personal website! You can read about who I am on the About Me page.</p>
</div>
</main>
<footer>
<nav class="navbar-default container-fluid">
<ul class="nav nav-justified">
<li><a href="#">About Me</a></li>
<li><a href="#">Portfolio</a></li>
<li><a href="#">My Favorites</a></li>
<li><a href="https://www.facebook.com/osman.zakir.31">Get me on Facebook</a></li>
<li><a href="mailto:[email protected]">Email Me</a></li>
</ul>
</nav>
</footer>
</body>
</html>
Raw
styles.css
header.jumbotron {
background-image: url(../images/DesignEvo.jpg);
background-repeat: no-repeat;
background-position: center;
margin-top: 20px;
}
body {
background-color: cadetblue;
color: black;
text-align: left;
vertical-align: central;
}
a {
color: navy;
text-align: center;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment