Skip to content

Instantly share code, notes, and snippets.

@ClaireToulouse

ClaireToulouse/html challenge

Last active September 2, 2018 18:07
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save ClaireToulouse/5bcd16d412247106e4c93f7497798bde to your computer and use it in GitHub Desktop.
Save ClaireToulouse/5bcd16d412247106e4c93f7497798bde to your computer and use it in GitHub Desktop.
Download ZIP
Raw
html challenge
<!DOCTYPE html>
<html lang=en>
<head>
<meta charset="UTF-8">
<title>FindThePrecious.com</title>
</head>
<body>
<header>
<nav>
<ul>
<li><a href="http://FindThePrecious.com">FindThePrecious.com</a></li>
<li><a href="#section1">Fellows</a></li>
<li><a href="#section2">The Ring</a></li>
<li><a href="#section3">Get My Reward</a></li>
<li><a href="#section3">Best hunters</a></li>
<li><a href="#section5">Join the Army</a></li>
<li><a href="#section6">Contact us</a></li>
</ul>
</nav>
</header>
<div>
<img src="image.jpg" alt="Banner image">
<p> Dangerous goblins...</p>
</div>
<section>
<h2 id="section1"> Fellows wanted dead...</h2>
<ul>
<li> <a href="#tab1">Most wanted</a>
<ul>
<li><img src="wizard.jpg" alt="Wizard">
<h3>The Wizard</h3>
<p> small description</p>
</li>
<li><img src="hobbit3.jpg" alt="Hobbit">
<h3>Hobbit #3</h3>
<p> small description</p>
</li>
<li><img src="Dwarf.jpg" alt="Dwarf">
<h3>Yummy Dwarf</h3>
<p> small description</p>
</li>
</ul>
</li>
<li><a href="#tab2">Most dangerous</a></li>
<li><a href="#tab3">Already captured</a></li>
</ul>
</section>
<section>
<h2 id="section2"> I have captured...</h2>
<p> Lorem ipsum...</p>
<img src="image.jpg" alt="Reward">
<input type="submit" value="Contact us" />
</section>
<section>
<h2 id="section4"> Best hunters</h2>
<ul>
<li><img src="user1.jpg" alt="user1">
<p> user name</p>
</li>
<li><img src="user2.jpg" alt="user2">
<p> user name 2</p>
</li>
</ul>
</section>
<section>
<h2 id="section3"> About the ring</h2>
<p>What can our master...</p>
<table>
<tr>
<td>Feature </td>
<td>Description</td>
</tr>
<tr>
<td>text</td>
<td>text</td>
</tr>
<tr>
<td>text</td>
<td>text</td>
</tr>
<tr>
<td>text</td>
<td>text</td>
</tr>
</table>
<q>My precious.....</q>
<img src="image.jpg" alt="Gollum image">
</section>
<section>
<h2 id="section5"> Join Mordor Army</h2>
<img src="image.jpg" alt="Reward img">
<p>Lorem ipsum...</p>
<input type="submit" value="Moreinfoon..." />
</section>
<section>
<h2 id="section6"> Contact Us</h2>
<form action="/action_page.php">
<input type="text" name="email">
<br>
<input type="text" name="lastname">
<br>
<select name="profil">
<option value="seen" selected="selected">I have seen one of them</option>
<option value="captured">I have captured one of them</option>
<option value="join">I want to join your armyl</option></select>
<br>
<textarea id="message" rows="3" cols="20"></textarea>
<br>
<input type="submit" value="Submit"><br><br>
</form>
</section>
<footer>
<a href="#section6">About us</a>
<a href="#section1">Fellows</a>
<a href="#section5">Join our Army</a>
<a href="#faq">FAQ</a>
<a href="#section2">Reward conditions</a>
<a href="#legal">Legal mentions</a>
<a href="https://sauron4ever.com"><b>Sauron4ever.com</b></a>
<a href="https://sauron4ever.com"><b>Follow him on Twitter</b></a>
</footer>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment