Skip to content

Instantly share code, notes, and snippets.

@JexeI
Created November 3, 2016 16:25
Show Gist options
  • Save JexeI/c18c57906025bba2e6d007bc5ab98b30 to your computer and use it in GitHub Desktop.
Save JexeI/c18c57906025bba2e6d007bc5ab98b30 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="font-awesome-animation.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://use.fontawesome.com/985ae137b1.js"></script>
<style>
h1 {
color: white;
text-shadow: 2px 2px 4px #000000;
}
h3 {
color: white;
text-shadow: 2px 2px 4px #000000;
}
</style>
</head>
<body background="https://avicus.net/assets/bg/pattern.png">
<nav class="navbar navbar-default navbar-static-top">
<div class="container">
<div class="navbar-header">
<button class="navbar-toggle collapsed" data-target="#top-navbar-collapse" data-toggle="collapse" id="top-navbar-collapse-button">
<span class="fa fa-bars"></span>
</button>
<a class="navbar-brand" href="/">
<img class="pull-left" height="34" src="http://i.imgur.com/RMKNpGQ.png">
</a>
</div>
<div class="navbar-collapse collapse" id="top-navbar-collapse">
<ul class="nav navbar-nav" style="margin-right: 0;">
<li class="active"> <a href="index.html"> <em class="fa fa-home"></em> Homepage </a></li>
<li> <a href="secondpage.html"> <em class="fa fa-cubes"></em> Second Page </a> </li>
<li>
<a href="/forums">
<i class="fa fa-comments"></i>
Third Page
</a>
</li>
</ul>
<hr class="visible-xs visible-sm" style="margin: 4px; border-color: #e7e7e7;">
<ul class="nav navbar-nav pull-right">
<li class="dropdown">
<ul class="dropdown-menu dropdown-menu-right">
<li><a href="/Jexel">Profile</a></li>
<li><a href="/alerts">Alerts</a></li>
<li><a href="/friendships">Friendships</a></li>
<li><a href="/transactions">Transactions</a></li>
<li><a href="/reports">Reports</a></li>
<li><a href="/appeals">Appeals</a></li>
<li><a href="/users/edit">Account</a></li>
<li><a rel="nofollow" data-method="delete" href="/users/sign_out">Logout</a></li>
</ul>
</li>
</ul>
</div>
</div>
</nav>
<div class="container" style="background-image: url(https://avicus.net/assets/bg/pattern.png);"> <!--Background-->
<div class="jumbotron text-center" style="margin:0;background-image:url(http://i58.tinypic.com/kcmfsz.png);border-width:2px;border-style:solid;border-color:#eeeee;opacity:0.78">
<h1 style="color:#FFFFFF ">Hello</h1>
<hr>
<p>Welcome to my Student Website</p>
<p>Here you can find me screwing around</p>
<div class="jumbotron text-center" style="background-image:url(http://www.joomlaworks.net/images/demos/galleries/abstract/7.jpg);background-attachment:fixed;background-repeat:repeat;background-position:center;margin:0;"><em class="fa fa-envelope-o fa-5x " aria-hidden="true"></em>
<div class="jumbotron text-center" style="margin:0;background-image:url(http://oi62.tinypic.com/1z6cavq.jpg);border-width:2px;border-style:solid;border-color:#eeeee;opacity:0.97">
<h3 style="color:Red ">The <a href="http://www.fitnessgram.net/" target="_blank">FitnessGram</a>™ Pacer Test is a multistage aerobic capacity test that progressively gets more difficult as it continues. </h3>
<h3 style="color:Red ">The 20 meter pacer test will begin in 30 seconds. Line up at the start. The running speed starts slowly, but gets faster each minute after you hear this signal. beep </h3>
<h3 style="color:Red ">A single lap should be completed each time you hear this sound. ding Remember to run in a straight line, and run as long as possible. </h3>
<h3 style="color:Red ">The second time you fail to complete a lap before the sound, your test is over. The test will begin on the word start. On your mark, get ready, start. </h3>
</div>
</div>
<br><br><br>
<div class="jumbotron text-center" style="background-image:url(http://7606-presscdn-0-74.pagely.netdna-cdn.com/wp-content/uploads/2016/03/Dubai-Photos-Images-Dubai-UAE-Pictures-800x600.jpg);background-attachment:fixed;background-repeat:repeat;background-position:center;margin:0;"><i class="fa fa-cog fa-5x"></i>
<span class="sr-only">Loading...</span>
<div class="jumbotron text-center" style="margin:0;background-image:url(http://oi62.tinypic.com/1z6cavq.jpg);border-width:2px;border-style:solid;border-color:#eeeee;opacity:0.97">
<h3 style="color:Orange "><a href="https://en.wikipedia.org/wiki/Three_Rings" target="_blank">Three Rings</a> for the <a href="https://en.wikipedia.org/wiki/Elf_(Middle-earth)" target="_blank">Elven-kings</a> under the sky, </h3>
<h3 style="color:Orange ">Seven for the Dwarf-lords in their halls of stone, </h3>
<h3 style="color:Orange ">Nine for Mortal Men doomed to die, </h3>
<h3 style="color:Orange ">One for the Dark Lord on his dark throne In the Land of Mordor where the Shadows lie. </h3>
<h3 style="color:Orange ">One Ring to rule them all, One Ring to find them, One Ring to bring them all and in the darkness bind them </h3>
<h3 style="color:Orange ">In the Land of Mordor where the Shadows lie.<br>
</h3>
</div>
</div>
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment