75 lines
6.6 KiB
HTML
75 lines
6.6 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||
<title>Ma Page</title>
|
||
<link rel="stylesheet" href="style.css"/>
|
||
</head>
|
||
<body>
|
||
<div class="header">
|
||
<h1>
|
||
EX3 : le selecteur class
|
||
</h1>
|
||
</div>
|
||
|
||
<div class="nav">
|
||
<div>
|
||
<img src="link.png" alt="external link logo">
|
||
<a href="https://lyceelafayette.fr">lyceelafayette.fr</a>
|
||
</div>
|
||
<div>
|
||
<img src="link.png" alt="external link logo">
|
||
<a href="https://github.com/mirsella">mon github</a>
|
||
</div>
|
||
<div>
|
||
<a href="#lorem">Lorem Ipsum</a>
|
||
</div>
|
||
</div>
|
||
|
||
<table>
|
||
<tr>
|
||
|
||
<td class="content">
|
||
<a class="ortener" href="https://ortener.herokuapp.com/">
|
||
<p>ortener : un raccourcisseur d'URL que j'ai fait</p>
|
||
<img src="ortener.png" alt="ortener">
|
||
</a>
|
||
<div class="pilar">
|
||
<img src="pilar_of_creaton_upsacled.png" alt="pilar of creation">
|
||
<p>
|
||
Pillars of Creation is a photograph taken by the Hubble Space Telescope of elephant trunks of interstellar gas and dust in the Eagle Nebula, in the Serpens constellation, some 6,500–7,000 light years from Earth. They are so named because the gas and dust are in the process of creating new stars, while also being eroded by the light from nearby stars that have recently formed. Taken on April 1, 1995, it was named one of the top ten photographs from Hubble by Space.com. The astronomers responsible for the photo were Jeff Hester and Paul Scowen from Arizona State University. The region was rephotographed by ESA's Herschel Space Observatory in 2011, and again by Hubble in 2014 with a newer camera. Released in 2007, Chandra X-ray Observatory had observed the area in 2001; it did not find many X-ray sources in the towers but was able to observe sources at various X-ray energy levels in the area from young stars.
|
||
</p>
|
||
</div>
|
||
<div id="lorem">
|
||
<h4>Lorem Ipsum</h4>
|
||
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut tristique et egestas quis ipsum. Aliquet bibendum enim facilisis gravida. Suspendisse potenti nullam ac tortor. Quisque id diam vel quam elementum pulvinar. A condimentum vitae sapien pellentesque habitant morbi. Fermentum posuere urna nec tincidunt praesent. Consectetur lorem donec massa sapien faucibus et molestie ac feugiat. Urna neque viverra justo nec ultrices dui sapien eget. Placerat vestibulum lectus mauris ultrices eros in cursus turpis. A erat nam at lectus urna duis. Ac tincidunt vitae semper quis lectus nulla. At augue eget arcu dictum.</p>
|
||
<p>Dictum fusce ut placerat orci. Amet dictum sit amet justo. Diam vel quam elementum pulvinar. Et netus et malesuada fames ac turpis. Elementum integer enim neque volutpat ac tincidunt vitae. Quis eleifend quam adipiscing vitae proin sagittis nisl rhoncus mattis. Non diam phasellus vestibulum lorem sed. Eu mi bibendum neque egestas congue quisque. Quis blandit turpis cursus in hac habitasse. Sollicitudin nibh sit amet commodo nulla. Eu tincidunt tortor aliquam nulla facilisi. Leo integer malesuada nunc vel. Nibh nisl condimentum id venenatis a condimentum vitae. Ut tellus elementum sagittis vitae et leo duis ut. Sed felis eget velit aliquet sagittis id consectetur purus ut. Nec feugiat in fermentum posuere urna nec. Viverra mauris in aliquam sem fringilla ut morbi. Nibh sit amet commodo nulla facilisi. Tellus pellentesque eu tincidunt tortor aliquam. In dictum non consectetur a erat nam at lectus.</p>
|
||
<p>Nisl nisi scelerisque eu ultrices vitae auctor. Viverra accumsan in nisl nisi scelerisque eu ultrices vitae auctor. Integer vitae justo eget magna fermentum iaculis. Egestas fringilla phasellus faucibus scelerisque. Ultricies integer quis auctor elit sed. Lorem ipsum dolor sit amet consectetur adipiscing. Gravida arcu ac tortor dignissim convallis aenean et. Tempor id eu nisl nunc mi ipsum. Dolor magna eget est lorem ipsum dolor sit amet consectetur. Tincidunt id aliquet risus feugiat in. Magna fermentum iaculis eu non diam phasellus vestibulum. Diam maecenas sed enim ut sem viverra.</p>
|
||
<p>Maecenas ultricies mi eget mauris pharetra et. Fames ac turpis egestas maecenas pharetra convallis. Integer vitae justo eget magna fermentum. Lobortis scelerisque fermentum dui faucibus in ornare quam. Mi in nulla posuere sollicitudin aliquam ultrices. Cursus vitae congue mauris rhoncus. Adipiscing elit duis tristique sollicitudin nibh sit amet. Bibendum enim facilisis gravida neque convallis a cras. Magna sit amet purus gravida quis blandit turpis cursus in. Sed ullamcorper morbi tincidunt ornare. At tempor commodo ullamcorper a. Ut lectus arcu bibendum at varius vel pharetra. Ut etiam sit amet nisl purus in mollis nunc. Vestibulum morbi blandit cursus risus at ultrices mi tempus imperdiet. Ornare massa eget egestas purus viverra accumsan. Sit amet tellus cras adipiscing enim eu turpis. Habitant morbi tristique senectus et netus et. Ipsum consequat nisl vel pretium lectus. Fames ac turpis egestas integer eget aliquet. Lorem dolor sed viverra ipsum nunc aliquet bibendum.</p>
|
||
<p>Natoque penatibus et magnis dis. Condimentum mattis pellentesque id nibh tortor id aliquet lectus proin. Sit amet commodo nulla facilisi nullam vehicula. Nisl condimentum id venenatis a condimentum. Blandit libero volutpat sed cras ornare. Aliquam sem fringilla ut morbi. Vitae suscipit tellus mauris a diam maecenas sed. Sed tempus urna et pharetra pharetra massa. Metus dictum at tempor commodo ullamcorper a. Quisque egestas diam in arcu. Faucibus et molestie ac feugiat sed lectus vestibulum mattis. Purus semper eget duis at tellus at urna. Vitae turpis massa sed elementum tempus egestas. Quam quisque id diam vel quam elementum pulvinar. Nibh mauris cursus mattis molestie a. Cursus metus aliquam eleifend mi in nulla posuere sollicitudin aliquam. Faucibus nisl tincidunt eget nullam non nisi est sit. Odio pellentesque diam volutpat commodo.</p>
|
||
</div>
|
||
</td>
|
||
|
||
<td class="aside">
|
||
<h4>mes souhaits :</h4>
|
||
<ol>
|
||
<li>developpeur informatique</li>
|
||
<li>admin linux</li>
|
||
<li>cybersécurité</li>
|
||
<li>réseau informatique</li>
|
||
</ol>
|
||
</td>
|
||
</tr>
|
||
</table>
|
||
|
||
|
||
<div class="footer">
|
||
<div>
|
||
<p>GILLARD Lucas / T2D3 / 2021 LYC La Fayette</p>
|
||
</div>
|
||
</div>
|
||
</body>
|
||
</html>
|