Commit c998e79f authored by Qwerty's avatar Qwerty

Add example file and Nav

parent 29ea9364
......@@ -29,8 +29,6 @@ RESET CSS BY QWERTY https://framagit.org/champlywood/Reset.css
}
*:before,
*:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary {
......@@ -457,6 +455,12 @@ input[type=button],input[type=image],input[type=reset],input[type=submit],button
/* -----------------------------------------------------
7 - COMPOSITION
----------------------------------------------------- */
nav {
margin:auto;
display: flex;
flex-wrap: wrap;
justify-content: space-around;
}
/* -----------------------------------------------------
8 - RESPONSIVE
......@@ -505,7 +509,8 @@ input[type=button],input[type=image],input[type=reset],input[type=submit],button
color: #000!important;
text-decoration: underline!important;
}
main a[href]:after {
a[href]:after {
content: "(" attr(href) ")";
}
}
......@@ -2,20 +2,78 @@
<html lang="fr">
<head>
<meta charset="utf-8"/>
<link rel="stylesheet" href="assets/style.css"/>
<link rel="stylesheet" href="reset.css"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
<title></title>
<title>Title Name</title>
</head>
<body>
<header>
<h1></h1>
<h1>Title of my website</h1>
</header>
<nav>
<a href="#">Lien 1</a>
<a href="#">Link 1</a>
<a href="#">Link 2</a>
<a href="#">Link 3</a>
<a href="#">Link 4</a>
</nav>
<article>
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>
<p>It's a paragraph</p>
<figure>
<img src="https://source.unsplash.com/random" alt="Picture"/>
<figcaption>Random Picture</figcaption>
</figure>
<blockquote>I love chocolate - Napoléon Bonaparte</blockquote>
<code>print hello world</code>
</article>
<form>
<fieldset>
<legend>Legend</legend>
<label><input type="text" /> Text</label>
<label><input type="radio"></label>
<input type="checkbox">
<select multiple>
<option value="one">One</option>
<option value="two">Two</option>
<option value="three">Three</option>
</select>
</fieldset>
<textarea></textarea>
<input type="submit">
</form>
<ul>
<li>Chocolat</li>
<li>Coffee</li>
<li>Tea</li>
</ul>
<ol>
<li>Gold</li>
<li>Silver</li>
<li>Bronze</li>
</ol>
<table>
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
</table>
<footer>
</footer>
</body>
</html>
\ No newline at end of file
</html>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment