» Fiche de lien type

avatar
Mungu wa mwishoCompte PNJ
Messages : 73
Points rp : 828
Dim 12 Aoû - 23:32


Prénom Nom •• Groupe


présentation
âge
origines
travail
passion
autre

Liens recherchés

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean eu dapibus leo, porta sodales ex. Vestibulum sodales aliquam posuere. Aenean quis efficitur ipsum. Donec blandit facilisis elit at tristique. Nullam leo nisl, consectetur quis consectetur vitae, volutpat sit amet risus. Vestibulum at molestie leo, quis posuere urna. Maecenas lacinia purus sem. Sed accumsan nec metus ut lobortis. Pellentesque a auctor libero. Vivamus id lobortis ex. Vivamus ut imperdiet dui. Aliquam sodales sem eu tellus ultrices, ut ornare lectus iaculis. Ut tellus nunc, ornare at quam non, hendrerit bibendum risus.

Sed auctor felis tellus, tristique maximus neque vehicula ac. Aliquam aliquet porta arcu quis semper. Aliquam ut turpis tincidunt, ullamcorper eros a, mattis dolor. Mauris vitae egestas augue. Donec lacinia sapien eu felis euismod, quis elementum dolor placerat. Mauris in leo dictum, maximus velit vel, sollicitudin leo. Sed non tellus libero. Proin venenatis laoreet justo, vitae porta augue. Quisque id ipsum gravida, elementum felis eu, tempor lacus. Etiam quam enim, bibendum a leo in, scelerisque hendrerit ex. Mauris dictum erat at urna hendrerit ultricies ullamcorper vel nibh. Suspendisse a bibendum nulla, sed tempor augue.



Caractère

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean eu dapibus leo, porta sodales ex. Vestibulum sodales aliquam posuere. Aenean quis efficitur ipsum. Donec blandit facilisis elit at tristique. Nullam leo nisl, consectetur quis consectetur vitae, volutpat sit amet risus. Vestibulum at molestie leo, quis posuere urna. Maecenas lacinia purus sem. Sed accumsan nec metus ut lobortis. Pellentesque a auctor libero. Vivamus id lobortis ex. Vivamus ut imperdiet dui. Aliquam sodales sem eu tellus ultrices, ut ornare lectus iaculis. Ut tellus nunc, ornare at quam non, hendrerit bibendum risus.

Sed auctor felis tellus, tristique maximus neque vehicula ac. Aliquam aliquet porta arcu quis semper. Aliquam ut turpis tincidunt, ullamcorper eros a, mattis dolor. Mauris vitae egestas augue. Donec lacinia sapien eu felis euismod, quis elementum dolor placerat. Mauris in leo dictum, maximus velit vel, sollicitudin leo. Sed non tellus libero. Proin venenatis laoreet justo, vitae porta augue. Quisque id ipsum gravida, elementum felis eu, tempor lacus. Etiam quam enim, bibendum a leo in, scelerisque hendrerit ex. Mauris dictum erat at urna hendrerit ultricies ullamcorper vel nibh. Suspendisse a bibendum nulla, sed tempor augue.



RP Terminés

Vide



Code:
<style>.clear {clear: both;} .fiche_ledger {width: 520px; margin: auto; background: #2b2b2b; border-bottom: 10px solid #78BAD7; padding: 0 0 3% 0;} .fiche_ledger .entete {border: 10px solid #78BAD7;} .fiche_ledger h2 {font-family: time new roman; font-size: 30px; background: #78BAD7; text-align: center; margin: 0; padding: 0 0 2% 0; color: #fff; letter-spacing: -2px; text-transform: lowercase;} .ledger_info1 {width: 40%; float: left;} .ledger_info1 a, .ledger_info1 .li1, .ledger_liens a {display: block; background: #383838; border-right: 10px solid #78BAD7; width: 100%; box-sizing: border-box; color: #fff; margin: 1% 0; font-size: 18px; letter-spacing: -2px; text-align: right; padding: 1% 10% 1% 1%; text-transform: lowercase; font-weight: bold;} .ledger_info1 a:hover, .ledger_info1 .li1:hover {color: #383838 !important; background: #78BAD7; font-style: italic;} .ledger_info2 {background: #383838; width: 80%; margin: auto; padding: 2%; box-sizing: border-box;} .ledger_info2 h3, .ledger_info3 h3 {color: #78BAD7; display: block; font-size: 20px; font-style: italic; font-weight: 700; line-height: 20px; text-align: center; margin: 0;} .ledger_info2 p {color: #fff; font-size: 10px; text-align: justify; width: 100%; height: 110px; overflow: auto;} .ledger_images {text-align: center;} .ledger_info3 {background: #383838; width: 50%; margin: 0 0 0 5%; padding: 2%; box-sizing: border-box; float: left;} .ledger_info3 p {color: #fff; font-size: 10px; width: 100%; height: 85px; overflow: auto; text-align: justify;} .ledger_liens {width: 40%; float: right;}</style>
<div class="fiche_ledger"><img class="entete" src="https://imgur.com/R8dsELZ.gif">
<h2>Prénom Nom •• Groupe</h2>
<div class="ledger_info1"><a href="#">présentation</a><div class="li1">âge</div><div class="li1">origines</div><div class="li1">travail</div><div class="li1">passion</div><div class="li1">autre</div></div><div class="ledger_info3"><h3>Liens recherchés</h3><p><i>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean eu dapibus leo, porta sodales ex. Vestibulum sodales aliquam posuere. Aenean quis efficitur ipsum. Donec blandit facilisis elit at tristique. Nullam leo nisl, consectetur quis consectetur vitae, volutpat sit amet risus. Vestibulum at molestie leo, quis posuere urna. Maecenas lacinia purus sem. Sed accumsan nec metus ut lobortis. Pellentesque a auctor libero. Vivamus id lobortis ex. Vivamus ut imperdiet dui. Aliquam sodales sem eu tellus ultrices, ut ornare lectus iaculis. Ut tellus nunc, ornare at quam non, hendrerit bibendum risus.

Sed auctor felis tellus, tristique maximus neque vehicula ac. Aliquam aliquet porta arcu quis semper. Aliquam ut turpis tincidunt, ullamcorper eros a, mattis dolor. Mauris vitae egestas augue. Donec lacinia sapien eu felis euismod, quis elementum dolor placerat. Mauris in leo dictum, maximus velit vel, sollicitudin leo. Sed non tellus libero. Proin venenatis laoreet justo, vitae porta augue. Quisque id ipsum gravida, elementum felis eu, tempor lacus. Etiam quam enim, bibendum a leo in, scelerisque hendrerit ex. Mauris dictum erat at urna hendrerit ultricies ullamcorper vel nibh. Suspendisse a bibendum nulla, sed tempor augue. </p></div><div class="clear"></div>
<div class="ledger_images"><img src="https://i.imgur.com/Tcht26a.png"> <img src="https://i.imgur.com/EEKxtr5.jpg"> <img src="https://i.imgur.com/rWcb506.png"> <img src="https://i.imgur.com/oMs6UHa.png"></div>
<div class="ledger_info2"><h3>Caractère</h3><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean eu dapibus leo, porta sodales ex. Vestibulum sodales aliquam posuere. Aenean quis efficitur ipsum. Donec blandit facilisis elit at tristique. Nullam leo nisl, consectetur quis consectetur vitae, volutpat sit amet risus. Vestibulum at molestie leo, quis posuere urna. Maecenas lacinia purus sem. Sed accumsan nec metus ut lobortis. Pellentesque a auctor libero. Vivamus id lobortis ex. Vivamus ut imperdiet dui. Aliquam sodales sem eu tellus ultrices, ut ornare lectus iaculis. Ut tellus nunc, ornare at quam non, hendrerit bibendum risus.

Sed auctor felis tellus, tristique maximus neque vehicula ac. Aliquam aliquet porta arcu quis semper. Aliquam ut turpis tincidunt, ullamcorper eros a, mattis dolor. Mauris vitae egestas augue. Donec lacinia sapien eu felis euismod, quis elementum dolor placerat. Mauris in leo dictum, maximus velit vel, sollicitudin leo. Sed non tellus libero. Proin venenatis laoreet justo, vitae porta augue. Quisque id ipsum gravida, elementum felis eu, tempor lacus. Etiam quam enim, bibendum a leo in, scelerisque hendrerit ex. Mauris dictum erat at urna hendrerit ultricies ullamcorper vel nibh. Suspendisse a bibendum nulla, sed tempor augue. </p></div>

<div class="ledger_info3"><h3>RP Terminés</h3><p><i>Vide</i></p></div><div class="ledger_liens"><a href="#">Keep the fishing</a><a href="#">Destruction - Intrigue</a><a href="#">Dans ta face !</a><a href="#">Bomberman</a><a href="#">#</a><a href="#">#</a></div><div class="clear"></div></div>



Pseudo


Type de relation


Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed id risus ut odio pulvinar venenatis vitae vitae purus. Curabitur faucibus eu massa at eleifend. Integer eu metus tempus, mollis neque non, blandit tortor. Nunc nec urna varius, faucibus nulla ac, finibus ipsum. Morbi lectus magna, euismod eu turpis sed, volutpat molestie nulla. Vivamus in massa metus. Fusce in sollicitudin purus.

Maecenas pulvinar lectus sem, vel porttitor tortor feugiat vitae. Proin iaculis lacus eget felis tincidunt dictum. Praesent sit amet fermentum massa, quis vestibulum justo. Quisque fringilla facilisis consequat. Sed hendrerit magna dignissim ipsum dictum dignissim. Etiam ex diam, dapibus ac sapien vel, aliquet pretium odio. Vivamus et libero ac massa euismod fringilla in et ex. Sed molestie iaculis orci sit amet hendrerit. Donec lectus ligula, volutpat ut erat sed, fringilla bibendum dolor.


Code:
<style>.fiche_ledger2 {width: 520px; margin: auto; background: url('https://i.imgur.com/f5528nP.jpg'); border-bottom: 10px solid #78BAD7; padding: 5%; box-sizing: border-box;} .fiche_ledger2 h2 {background: none; font-family: time new roman; font-size: 30px; text-align: left; margin: 0; padding: 0; letter-spacing: -2px; text-transform: lowercase;} .fiche_ledger2 h3 {margin: -2% 0 0 0; color: #fff; font-weight: normal; font-size: 8px; text-transform: uppercase; letter-spacing: 2px;} .ledger_info4 {width: 85%; margin: auto; background: #f4f4f4; color: #383838; padding: 5%; box-sizing: border-box; text-align: justify; height: 100px; overflow: auto; font-size: 11px; line-height: 1.8;} .ledger_info4 .li1 {display: block; border-right: 10px solid #383838; width: 100%; box-sizing: border-box; margin: 1% 0; font-size: 16px; letter-spacing: -1px; text-align: right; padding: 0 5% 0 0; text-transform: lowercase; font-weight: bold; line-height: 1; color: #000;} .ledger_barre {width: 10px; height: 100px; float: left;}</style>
<div class="fiche_ledger2"><h2 style="color: #78BAD7;">Pseudo</h2>
<h3>Type de relation</h3>
<div class="ledger_barre" style="background: #78BAD7;"></div><div class="ledger_info4">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed id risus ut odio pulvinar venenatis vitae vitae purus. Curabitur faucibus eu massa at eleifend. Integer eu metus tempus, mollis neque non, blandit tortor. Nunc nec urna varius, faucibus nulla ac, finibus ipsum. Morbi lectus magna, euismod eu turpis sed, volutpat molestie nulla. Vivamus in massa metus. Fusce in sollicitudin purus.

Maecenas pulvinar lectus sem, vel porttitor tortor feugiat vitae. Proin iaculis lacus eget felis tincidunt dictum. Praesent sit amet fermentum massa, quis vestibulum justo. Quisque fringilla facilisis consequat. Sed hendrerit magna dignissim ipsum dictum dignissim. Etiam ex diam, dapibus ac sapien vel, aliquet pretium odio. Vivamus et libero ac massa euismod fringilla in et ex. Sed molestie iaculis orci sit amet hendrerit. Donec lectus ligula, volutpat ut erat sed, fringilla bibendum dolor.</div></div>

Pour rajouter un lien.
Ajouter :

Code:
<h2 style="color: #78BAD7;">Pseudo</h2>
<h3>Type de relation</h3>
<div class="ledger_barre" style="background: #78BAD7;"></div><div class="ledger_info4">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed id risus ut odio pulvinar venenatis vitae vitae purus. Curabitur faucibus eu massa at eleifend. Integer eu metus tempus, mollis neque non, blandit tortor. Nunc nec urna varius, faucibus nulla ac, finibus ipsum. Morbi lectus magna, euismod eu turpis sed, volutpat molestie nulla. Vivamus in massa metus. Fusce in sollicitudin purus.

Maecenas pulvinar lectus sem, vel porttitor tortor feugiat vitae. Proin iaculis lacus eget felis tincidunt dictum. Praesent sit amet fermentum massa, quis vestibulum justo. Quisque fringilla facilisis consequat. Sed hendrerit magna dignissim ipsum dictum dignissim. Etiam ex diam, dapibus ac sapien vel, aliquet pretium odio. Vivamus et libero ac massa euismod fringilla in et ex. Sed molestie iaculis orci sit amet hendrerit. Donec lectus ligula, volutpat ut erat sed, fringilla bibendum dolor.</div>

Avant la dernière div.