N°1 Fiche PV simpliste [Verte]

Fiche PV simple

Cette fiche de PV / Scénario simpliste donne les informations des liens entres vos personnages via des infobulles nécessitant donc un codage CSS, fournit ci-dessous.

Laxy.

codage by Laxy Dunbar

Nom Prénom(s) Featuring L'Avatar

Informations

NOM PRENOM	DATE DE NAISSANCE	ÂGE	ORIGINE
LIEU DE NAISSANCE	SITUATION FAMILIALE	SITUATION	METIER/ETUDE

... Son histoire

Zu viel saecke, des esels untergang. Was alt ist, brummt gern. Neu liedlein singt man gern. Besser alt mit ehren, als jung mit schande. Zu viel saecke, des esels untergang. Was alt ist, brummt gern. Neu liedlein singt man gern. Besser alt mit ehren, als jung mit schande. Zu viel saecke, des esels untergang. Was alt ist, brummt gern. Neu liedlein singt man gern. Besser alt mit ehren, als jung mit schande. Zu viel saecke, des esels untergang. Was alt ist, brummt gern. Neu liedlein singt man gern. Besser alt mit ehren, als jung mit schande. Zu viel saecke, des esels untergang. Was alt ist, brummt gern. Neu liedlein singt man gern. Besser alt mit ehren, als jung mit schande. Zu viel saecke, des esels untergang. Was alt ist, brummt gern. Neu liedlein singt man gern. Besser alt mit ehren, als jung mit schande. Zu viel saecke, des esels untergang. Was alt ist, brummt gern. Neu liedlein singt man gern. Besser alt mit ehren, als jung mit schande. Zu viel saecke, des esels untergang. Was alt ist, brummt gern. Neu liedlein singt man gern. Besser alt mit ehren, als jung mit schande. Zu viel saecke, des esels untergang. Was alt ist, brummt gern. Neu liedlein singt man gern. Besser alt mit ehren, als jung mit schande.

Liens potentiels

Nom Prénom
Lien

codage by Laxy

CODE HTML :

Code:: <center><div style="width: 500px; height: 695px; background-color : #3A483F; border : 2px solid #6F8A62 "><table><tr><td><link href='https://fonts.googleapis.com/css?family=Amatic+SC' rel='stylesheet' type='text/css'></br><div style="width: 495px; height: 24px; background-color : #AEA984;text-align:center; line-height:7px; font-size:22px;">
<span style="color:#FFFFFF;font-family:Amatic SC;letter-spacing : 2px; text-shadow: 2px 0px 2px">Nom Prénom(s) Featuring L'Avatar</span></div></br><center><img src="https://66.media.tumblr.com/07114fedc4111dc91b674ae40e5dad64/tumblr_pgmcgu8T7a1qiiay5o2_250.gif" style="border: solid 1px #6F8A62; width: 490px; height: 230px"> </center></br><div style="text-align:center; line-height:4px; font-size:22px;">
<span style="color:#AEA984;font-family:Amatic SC;letter-spacing : 2px; text-shadow: 2px 0px 2px">Informations</span></div></td></tr></table></br><table><tr><td><center><div style="width: 120px; height: 15px; background-color : #AEA984;border-radius:8px 8px 8px 8px;font-family:arial;font-size:9px;letter-spacing:1px;color:#000000 ">NOM PRENOM</div></center></td><td><center><div style="width: 120px; height: 15px; background-color : #AEA984;border-radius:8px 8px 8px 8px;font-family:arial;font-size:9px;letter-spacing:1px;color:#000000 ">DATE DE NAISSANCE</div></center></td><td><center><div style="width: 120px; height: 15px; background-color : #AEA984;border-radius:8px 8px 8px 8px;font-family:arial;font-size:9px;letter-spacing:1px;color:#000000 ">ÂGE</div></center></td><td><center><div style="width: 120px; height: 15px; background-color : #AEA984;border-radius:8px 8px 8px 8px;font-family:arial;font-size:9px;letter-spacing:1px;color:#000000 ">ORIGINE</div></center></td></tr><tr><td><center><div style="width: 120px; height: 15px; background-color : #AEA984;border-radius:8px 8px 8px 8px;font-family:arial;font-size:9px;letter-spacing:1px;color:#000000 ">LIEU DE NAISSANCE</div></center></td><td><center><div style="width: 120px; height: 15px; background-color : #AEA984;border-radius:8px 8px 8px 8px;font-family:arial;font-size:9px;letter-spacing:1px;color:#000000 ">SITUATION FAMILIALE</div></center></td><td><center><div style="width: 120px; height: 15px; background-color : #AEA984;border-radius:8px 8px 8px 8px;font-family:arial;font-size:9px;letter-spacing:1px;color:#000000 ">SITUATION</div></center></td><td><center><div style="width: 120px; height: 15px; background-color : #AEA984;border-radius:8px 8px 8px 8px;font-family:arial;font-size:9px;letter-spacing:1px;color:#000000 ">METIER/ETUDE</div></center></td></tr></table></br><table><tr><td><center><div style="text-align:center; line-height:4px; font-size:22px;">
<span style="color:#AEA984;font-family:Amatic SC;letter-spacing : 2px; text-shadow: 2px 0px 2px">... Son histoire</span></div><div style="height:130px;overflow:auto; background-color : #3A483F;text-align:justify;font-family:arial;font-size:9px;letter-spacing:1px;color:#000000;padding: 10px; ">Zu viel saecke, des esels untergang. Was alt ist, brummt gern. Neu liedlein singt man gern. Besser alt mit ehren, als jung mit schande. Zu viel saecke, des esels untergang. Was alt ist, brummt gern. Neu liedlein singt man gern. Besser alt mit ehren, als jung mit schande. Zu viel saecke, des esels untergang. Was alt ist, brummt gern. Neu liedlein singt man gern. Besser alt mit ehren, als jung mit schande. Zu viel saecke, des esels untergang. Was alt ist, brummt gern. Neu liedlein singt man gern. Besser alt mit ehren, als jung mit schande. Zu viel saecke, des esels untergang. Was alt ist, brummt gern. Neu liedlein singt man gern. Besser alt mit ehren, als jung mit schande. Zu viel saecke, des esels untergang. Was alt ist, brummt gern. Neu liedlein singt man gern. Besser alt mit ehren, als jung mit schande. Zu viel saecke, des esels untergang. Was alt ist, brummt gern. Neu liedlein singt man gern. Besser alt mit ehren, als jung mit schande. Zu viel saecke, des esels untergang. Was alt ist, brummt gern. Neu liedlein singt man gern. Besser alt mit ehren, als jung mit schande. Zu viel saecke, des esels untergang. Was alt ist, brummt gern. Neu liedlein singt man gern. Besser alt mit ehren, als jung mit schande.</div></center></td></tr></table><center><div style="text-align:center; line-height:4px; font-size:22px;">
<span style="color:#AEA984;font-family:Amatic SC;letter-spacing : 2px; text-shadow: 2px 0px 2px">Liens potentiels</span></div></br><table><tr><td><div class="infobulle"><img src="https://66.media.tumblr.com/b8ab90a47d81ad5443a0897a5c1d100c/tumblr_pevuy48WJf1sv4q2po1_1280.jpg" style="width: 100px; height: 100px">
<span>Nom Prénom</br>Lien</span></div></td><td><div class="infobulle"><img src="https://66.media.tumblr.com/b8ab90a47d81ad5443a0897a5c1d100c/tumblr_pevuy48WJf1sv4q2po1_1280.jpg" style="width: 100px; height: 100px">
<span>Nom Prénom</br>Lien</span></div></td><td><div class="infobulle"><img src="https://66.media.tumblr.com/b8ab90a47d81ad5443a0897a5c1d100c/tumblr_pevuy48WJf1sv4q2po1_1280.jpg" style="width: 100px; height: 100px">
<span>Nom Prénom</br>Lien</span></div></center></td></tr></table><div style="font-size:6px; letter-spacing:3px; text-align:center; color : #6F4E37">codage by Laxy</div></center>

CODE CSS :

Code:: /*Infobulle*/
.infobulle{position: relative;z-index: 0;}

.infobulle:hover{background-color: transparent;z-index: 50;}

.infobulle span{
position: absolute;
background-color: #6F8A62;
padding: 5px;
left: -1000px;
visibility: hidden;
color: #000000;}

.infobulle span img{
border: 1px;
padding: 5px;}

.infobulle:hover span{
visibility: visible;
top: 70px;
left: 35px;
width: 150px ;
color:#000000;
border: 1px solid #6F8A62;
-moz-border-radius: 12px;
-webkit-border-radius: 12px;
border-radius: 12px;}
/*fin infobulle*/