Feilendyr

La faille des mondes
 

 :: Hors Jeu :: Registres :: Journaux de relations et rps Voir le sujet précédent Voir le sujet suivant Aller en bas

Modèle de fiche de lien

avatar
Messages : 8
Date d'inscription : 25/11/2017
Dim 26 Nov - 13:22
Nous vous proposons un modèle, mais il n'est pas obligatoire ! Vous pouvez utiliser le vôtre.
La fiche de lien est à copier/coller dans un nouveau sujet, avec les cadres de lien à la suite.

La fiche :

Code:
<style>.cheshire{width:560px;margin:20px auto;padding:20px;box-sizing:border-box;background:#E6E6E6;font-size:12px;font-family:calibri;color:#1C1C1C}.cheshire h1{margin:0 auto 20px;padding:10px;background-color:#E6E6E6;background-image:url(https://i62.servimg.com/u/f62/19/81/52/94/simple10.jpg);color:#1C1C1C1;font-size:20px;font-weight:400;text-align:center;letter-spacing:10px;text-transform:uppercase}h1.ches-fast{margin:20px auto}.ches-info{vertical-align:top;display:inline-block;padding:32px 30px 30px;width:276px;height:308px;box-sizing:border-box;background:#fff}.ches-avatar{display:inline-block;position:relative;width:220px;height:308px;margin:0 0 0 20px}#ches_avatar{width:220px}.ches-avatar:hover #ches_icon{opacity:1;-ms-transform:scale(1);-webkit-transform:scale(1);transform:scale(1)}#ches_icon{position:absolute;top:0;width:220px;height:308px;padding:12px 10px;box-sizing:border-box;background-color:#d59b84;background-image:url(https://i62.servimg.com/u/f62/19/81/52/94/simple10.jpg);text-align:center;opacity:0;-ms-transform:scale(0);-webkit-transform:scale(0);transform:scale(0);-webkit-transition:all .6s;transition:all .6s}#ches_icon img{width:70px;border:1px solid #fff;padding:5px;margin:5px}.ches-resume{line-height:18px;background-color:#d59b84;background-image:url(https://i62.servimg.com/u/f62/19/81/52/94/simple10.jpg);color:#fff}.ches-resume div{margin:0 0 10px}.ches-rp{margin:0 0 0 20px;background:#fff}.ches-left{vertical-align:top;display:inline-block;padding:30px;width:188px;height:230px;overflow:auto;text-align:justify}.ches-info div,.ches-rp div{padding:8px;margin:0 0 10px;text-align:center;border:1px solid #efe5de}.ches-rp div{margin:0 0 17px}.ches-info div:last-child,.ches-rp div:last-child{margin:0}</style><div class=cheshire><h1>Prénom Nom</h1><div class=ches-info><div>Information</div><div>Information</div><div>Information</div><div>Information</div><div>Information</div><div>Information</div></div><div class=ches-avatar><img alt="Mon avatar de BG"src=https://i62.servimg.com/u/f62/19/81/52/94/vav11.png id=ches_avatar><div id=ches_icon><img alt="Une icône de BG"src=https://i62.servimg.com/u/f62/19/81/52/94/10010010.png> <img alt="Une icône de BG"src=https://i62.servimg.com/u/f62/19/81/52/94/10010010.png> <img alt="Une icône de BG"src=https://i62.servimg.com/u/f62/19/81/52/94/10010010.png> <img alt="Une icône de BG"src=https://i62.servimg.com/u/f62/19/81/52/94/10010010.png> <img alt="Une icône de BG"src=https://i62.servimg.com/u/f62/19/81/52/94/10010010.png> <img alt="Une icône de BG"src=https://i62.servimg.com/u/f62/19/81/52/94/10010010.png></div></div><h1 class=ches-fast>vite fait</h1><div class="ches-left ches-resume"><div>Qualité - Qualité - Qualité - Qualité - Défaut - Défaut - Défaut - Défaut</div>
Résumé rapide de l'histoire.</div><div class="ches-left ches-rp"><div><a href=#>www</a> - rp .feat</div><div><a href=#>www</a> - rp .feat</div><div><a href=#>www</a> - rp .feat</div><div><a href=#>www</a> - rp .feat</div><div><a href=#>www</a> - rp .feat</div></div></div>


Aperçu :
 

Et la partie lien :

Code:
<style>.entete_fl1 {border-top: 1px solid #ffffff; border-bottom: 1px solid #ffffff; padding: 5px 0px 5px 0px; width:300px; margin:auto;} .titre_fl1 {background-color: #ffffff; padding:10px; width:280px; text-transform: uppercase; text-align:center; font-weight:bold;} .info_fl1 {text-transform: uppercase; font-size:10px; padding:10px; text-align:center;} .table_fl1 {margin:auto;width:410px; margin-bottom:10px;} .table_fl1 img {padding: 5px; border:1px solid #ffffff; width:100px; height:100px;} .perso_fl1 { width: 300px; border-top: 1px solid #ffffff; border-bottom: 1px solid #ffffff; height:100px; margin: 0px 5px 0px 5px; padding: 5px 0px 5px 0px;} .content_fl1 {background-color: #ffffff; height:90px; padding:5px;} .nom_fl1 {text-transform: uppercase; font-size:11px; font-weight: bold;} .infsup_fl1 {text-transform:lowercase; float:right;} .texte_fl1 {font-size:12px; height: 75px; overflow:auto; text-align:justify; padding-right: 5px;} .texte_fl1::-webkit-scrollbar { width: 5px; margin-left:5px;} .texte_fl1::-webkit-scrollbar-track-piece { background-color: #f9f9f9; } .texte_fl1::-webkit-scrollbar-thumb { background-color: #667371; } .credit_fl1 {font-size:9px; text-align:center;}</style><div class="entete_fl1"><div class="titre_fl1">Amis/Ennemis</div></div><div class="info_fl1">Infos supp, citation...</div><table class="table_fl1"><tr><td><img src="http://zupimages.net/up/15/49/pd4o.gif" /></td><td><div class="perso_fl1"><div class="content_fl1"><div class="nom_fl1">Nom du lien<span class="infsup_fl1"> Infos sur le lien</span></div><div class="texte_fl1">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div></div></div></td></tr></table><table class="table_fl1"><tr><td><div class="perso_fl1"><div class="content_fl1"><div class="nom_fl1">Nom du lien<span class="infsup_fl1"> Infos sur le lien</span></div><div class="texte_fl1">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div></div></div></td><td><img src="http://zupimages.net/up/15/49/pd4o.gif" /></td></tr></table><table class="table_fl1"><tr><td><img src="http://zupimages.net/up/15/49/pd4o.gif" /></td><td><div class="perso_fl1"><div class="content_fl1"><div class="nom_fl1">Nom du lien<span class="infsup_fl1"> Infos sur le lien</span></div><div class="texte_fl1">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div></div></div></td></tr></table><table class="table_fl1"><tr><td><div class="perso_fl1"><div class="content_fl1"><div class="nom_fl1">Nom du lien<span class="infsup_fl1"> Infos sur le lien</span></div><div class="texte_fl1">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div></div></div></td><td><img src="http://zupimages.net/up/15/49/pd4o.gif" /></td></tr></table><table class="table_fl1"><tr><td><img src="http://zupimages.net/up/15/49/pd4o.gif" /></td><td><div class="perso_fl1"><div class="content_fl1"><div class="nom_fl1">Nom du lien<span class="infsup_fl1"> Infos sur le lien</span></div><div class="texte_fl1">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div></div></div></td></tr></table><div class="credit_fl1">©gotheim pour <a href="http://epicode.bbactif.com/" target="_blank">epicode</a></div>

Aperçu:
 
Revenir en haut Aller en bas
Voir le sujet précédent Voir le sujet suivant Revenir en haut Page 1 sur 1

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
Feilendyr :: Hors Jeu :: Registres :: Journaux de relations et rps-
Sauter vers: