Skip to content

Instantly share code, notes, and snippets.

@ConstanceHT
Last active February 23, 2018 16:50
Show Gist options
  • Save ConstanceHT/d0e704e4852396cfef3f1aab1cdea23f to your computer and use it in GitHub Desktop.
Save ConstanceHT/d0e704e4852396cfef3f1aab1cdea23f to your computer and use it in GitHub Desktop.
FindThePrecious.com
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>FindThePrecious.com</title>
</head>
<body>
<header>
<h1>FindThePrecious.com</h1>
</header>
<!-- Début de la navigation -->
<nav id=menu>
<ul>
<li><a href="#">The ring</a></li>
<li><a href="#">Get my reward</a></li>
<li><a href="#">Best hunters</a></li>
<li><a href="#">Join the army</a></li>
<li><a href="#">Contact us</a></li>
</ul>
</nav>
<!-- fin de la navigation -->
<!-- Début du carrousel -->
<h2>Dangerous fellowship try to destroy the ring</h2>
<div id="carrousel">
<ul>
<li><a href="https://placeholder.com"><img src="http://via.placeholder.com/140x140" alt="placeholder"/></a></li>
<li><a href="https://placeholder.com"><img src="http://via.placeholder.com/140x140" alt="placeholder"/></a></li>
<li><a href="https://placeholder.com"><img src="http://via.placeholder.com/140x140" alt="placeholder"/></a></li>
</ul>
</div>
<!-- fin du carrousel -->
<!-- Début de la section 1 -->
<section>
<h2>Fellows wanted dead</h2>
<h3> or alive (if you went to eat them later)</h3>
<nav id="sousnav">
<ul>
<li><a href="#">Accueil</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">CV</a></li>
</ul>
</nav>
<ul class="tablecell">
<li><a href= "https://placeholder.com"><img src="http://via.placeholder.com/140x140" alt="placeholder"/>The Wizard</a>
<p>small description...</p>
</li>
<li><a href= "https://placeholder.com"><img src="http://via.placeholder.com/140x140" alt="placeholder"/>Hobbit #3</a>
<p>small description...</p>
</li>
<li><a href= "https://placeholder.com"><img src="http://via.placeholder.com/140x140" alt="placeholder"/>Yummy Dwarf</a>
<p>small description...</p>
</li>
</ul>
</section>
<hr>
<!-- fin de la section 1 -->
<!-- Début de la section 2 -->
<section>
<h2>I have capture one of them, how do i get my reward ?</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin molestie fringilla. Phasellus id lorem urna. Pellentesque sit amet lacinia lectus, et iaculis ante. Vestibulum vel faucibus neque. Duis convallis dui ut velit imperdiet convallis. Suspendisse ac egestas nulla. Sed pharetra mi pharetra dui suscipit vestibulum. Proin feugiat sem justo, sed vehicula lacus blandit nec.</p>
<input type="button" value="contact us"/>
<aside>
<img src="http://via.placeholder.com/140x140" alt="placeholder"/>
</aside>
</section>
<hr>
<!-- Début de la section 3 -->
<section>
<h2>Best hunters</h2>
<ul id= bestHunt>
<li> <h3>ElvesKiller22</h3>
<img src="http://via.placeholder.com/70x70" alt="placeholder"/>
<p>2 captures-</p>
<b><a href="#">Profile</a></b>
<input type="button" value="social"/>
</li>
<li> <h3>ElvesKiller22</h3>
<img src="http://via.placeholder.com/70x70" alt="placeholder"/>
<p>1 capture-</p>
<b><a href="#">Profile</a></b>
<input type="button" value="social"/>
</li>
</ul>
</section>
<hr>
<!-- fin de la section 3 -->
<!-- Début de la section 4 -->
<section>
<h3>Ring capabilities</h3>
<p>What can our master Sauron do with the ring ?</p>
<table>
<tr>
<th>Feature</th>
<th>Description</th>
</tr>
<tr>
<td>Main</td>
<td>One ring to rules them all</td>
</tr>
<tr>
<td>Invisibility</td>
<td>You can't see me</td>
</tr>
<tr>
<td>Power</td>
<td>Destroy the world</td>
</tr>
</table>
<h3>Why the Ring is awesome</h3>
<p>My preciooooooussssss ! Hrk Hrk, we want our preeciooooouuusssss !!</p>
<p>Gollum</p>
<aside>
<img src="http://via.placeholder.com/110x110" alt="placeholder"/>
</aside>
</section>
<hr>
<!-- fin de la section 4 -->
<!-- Début de la section 5 -->
<section>
<h2>Join Mordor Army, we need you !</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin molestie fringilla. Phasellus id lorem urna. Pellentesque sit amet lacinia lectus, et iaculis ante. Vestibulum vel faucibus neque. Duis convallis dui ut velit imperdiet convallis. Suspendisse ac egestas nulla. Sed pharetra mi pharetra dui suscipit vestibulum. Proin feugiat sem justo, sed vehicula lacus blandit nec.</p>
<input type="button" value="More info on SauronRulesThemAll.com"/>
<aside>
<img src="http://via.placeholder.com/140x140" alt="placeholder"/>
</aside>
</section>
<hr>
<!-- fin de la section 5 -->
<!-- Début de la section 6 -->
<section>
<h2>Contact us</h2>
<form>
<input type="text" name="email" placeholder="@"/>
<input type="text" name="address" placeholder=""/>
<select>
<option value="">I have seen one of them</option>
<option value="">1</option>
<option value="">2</option>
<option value="">3</option>
<option value="">4</option>
</select>
<textarea placeholder="your message"></textarea>
</form>
</section>
<!-- fin de la section 6 -->
<footer>
<a href= "#">About us</a>
<a href= "#">Fellow</a>
<a href= "#">Join the army</a>
<a href= "#">FAQ</a>
<a href= "#">Reward conditions</a>
<a href= "#">Legal mentions</a>
<a href= "#">Sauron4ever.com</a>
<a href= "#">Follow him on twitter</a>
</footer>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment