Partagez
Aller en bas
avatar
Admin
Messages : 45
Date d'inscription : 23/04/2013
Voir le profil de l'utilisateurhttp://forum-test-html.forumactif.org

FTEO Présa

le Sam 3 Oct - 17:01





Prénom P. Nom




Nom : Ici

Prénom : Ici

Âge : Ici

Sexe : Ici

Origine : Ici

Statut : Ici


Behind the screen


Un pseudo : Ici

Un âge : Ici

Comment tu nous as connu ? Ici

Le code du réglo ? Ici

Des commentaires ? Ici

???: Ici




Magie

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In condimentum purus venenatis ipsum feugiat vehicula. Praesent eleifend risus non vehicula rhoncus. Aenean in facilisis nibh. Proin luctus diam in magna aliquam, vel congue turpis tempus. Morbi at turpis massa. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce vulputate augue nec eros iaculis blandit. Praesent sodales turpis ut velit efficitur congue. Sed in turpis vitae libero facilisis egestas. Aenean pulvinar facilisis mauris, vitae accumsan diam aliquam eu.Lorem ipsum dolor sit amet, consectetur adipiscing elit. In condimentum purus venenatis ipsum feugiat vehicula. Praesent eleifend risus non vehicula rhoncus. Aenean in facilisis nibh. Proin luctus diam in magna aliquam, vel congue turpis tempus. Morbi at turpis massa. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce vulputate augue nec eros iaculis blandit. Praesent sodales turpis ut velit efficitur congue. Sed in turpis vitae libero facilisis egestas. Aenean pulvinar facilisis mauris, vitae accumsan diam aliquam eu.
Physique

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In condimentum purus venenatis ipsum feugiat vehicula. Praesent eleifend risus non vehicula rhoncus. Aenean in facilisis nibh. Proin luctus diam in magna aliquam, vel congue turpis tempus. Morbi at turpis massa. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce vulputate augue nec eros iaculis blandit. Praesent sodales turpis ut velit efficitur congue. Sed in turpis vitae libero facilisis egestas. Aenean pulvinar facilisis mauris, vitae accumsan diam aliquam eu.


Psychologie


Lorem ipsum dolor sit amet, consectetur adipiscing elit. In condimentum purus venenatis ipsum feugiat vehicula. Praesent eleifend risus non vehicula rhoncus. Aenean in facilisis nibh. Proin luctus diam in magna aliquam, vel congue turpis tempus. Morbi at turpis massa. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce vulputate augue nec eros iaculis blandit. Praesent sodales turpis ut velit efficitur congue. Sed in turpis vitae libero facilisis egestas. Aenean pulvinar facilisis mauris, vitae accumsan diam aliquam eu.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In condimentum purus venenatis ipsum feugiat vehicula. Praesent eleifend risus non vehicula rhoncus. Aenean in facilisis nibh. Proin luctus diam in magna aliquam, vel congue turpis tempus. Morbi at turpis massa. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce vulputate augue nec eros iaculis blandit. Praesent sodales turpis ut velit efficitur congue. Sed in turpis vitae libero facilisis egestas. Aenean pulvinar facilisis mauris, vitae accumsan diam aliquam eu.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In condimentum purus venenatis ipsum feugiat vehicula. Praesent eleifend risus non vehicula rhoncus. Aenean in facilisis nibh. Proin luctus diam in magna aliquam, vel congue turpis tempus. Morbi at turpis massa. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce vulputate augue nec eros iaculis blandit. Praesent sodales turpis ut velit efficitur congue. Sed in turpis vitae libero facilisis egestas. Aenean pulvinar facilisis mauris, vitae accumsan diam aliquam eu.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In condimentum purus venenatis ipsum feugiat vehicula. Praesent eleifend risus non vehicula rhoncus. Aenean in facilisis nibh. Proin luctus diam in magna aliquam, vel congue turpis tempus. Morbi at turpis massa. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce vulputate augue nec eros iaculis blandit. Praesent sodales turpis ut velit efficitur congue. Sed in turpis vitae libero facilisis egestas. Aenean pulvinar facilisis mauris, vitae accumsan diam aliquam eu.


Histoire


Lorem ipsum dolor sit amet, consectetur adipiscing elit. In condimentum purus venenatis ipsum feugiat vehicula. Praesent eleifend risus non vehicula rhoncus. Aenean in facilisis nibh. Proin luctus diam in magna aliquam, vel congue turpis tempus. Morbi at turpis massa. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce vulputate augue nec eros iaculis blandit. Praesent sodales turpis ut velit efficitur congue. Sed in turpis vitae libero facilisis egestas. Aenean pulvinar facilisis mauris, vitae accumsan diam aliquam eu.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In condimentum purus venenatis ipsum feugiat vehicula. Praesent eleifend risus non vehicula rhoncus. Aenean in facilisis nibh. Proin luctus diam in magna aliquam, vel congue turpis tempus. Morbi at turpis massa. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce vulputate augue nec eros iaculis blandit. Praesent sodales turpis ut velit efficitur congue. Sed in turpis vitae libero facilisis egestas. Aenean pulvinar facilisis mauris, vitae accumsan diam aliquam eu.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In condimentum purus venenatis ipsum feugiat vehicula. Praesent eleifend risus non vehicula rhoncus. Aenean in facilisis nibh. Proin luctus diam in magna aliquam, vel congue turpis tempus. Morbi at turpis massa. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce vulputate augue nec eros iaculis blandit. Praesent sodales turpis ut velit efficitur congue. Sed in turpis vitae libero facilisis egestas. Aenean pulvinar facilisis mauris, vitae accumsan diam aliquam eu.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In condimentum purus venenatis ipsum feugiat vehicula. Praesent eleifend risus non vehicula rhoncus. Aenean in facilisis nibh. Proin luctus diam in magna aliquam, vel congue turpis tempus. Morbi at turpis massa. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce vulputate augue nec eros iaculis blandit. Praesent sodales turpis ut velit efficitur congue. Sed in turpis vitae libero facilisis egestas. Aenean pulvinar facilisis mauris, vitae accumsan diam aliquam eu.


Spoiler:

Code:
<link href='https://fonts.googleapis.com/css?family=Poiret+One|Trade+Winds|Cinzel|Orbitron' rel='stylesheet' type='text/css'>

<style type="text/css"> .table1 { margin : auto; width : 90%; cellspacing : 0px; cellpadding : 0px; } .left1{ border : none; background-color : #a4a0a1; cellspacing : 0px; cellpadding : 0px; height : 320px; width : 250px; } .right1{ border : none; width : 60%; height : 320px; width : 440px; background-color : #a4a0a1; cellspacing : 0px; cellpadding : 0px; } .bgprésa { background-color : #8c0001; width :700px; height : auto; margin : auto; border : 3px solid black; padding : auto; } .imgfiche { overflow : hidden; top :0; left : 0; position : absolute; filter:alpha(opacity=100); -moz-opacity:1; opacity: 1; -webkit-transition: all 1s; -moz-transition: all 1s; -ms-transition: all 1s; -o-transition: all 1s; transition: all 1s; height : 320px; width : 250px; margin : auto; padding : auto; } .info1 { font-family : Trade Winds; font-size : 20px; font-weight : bold; text-align : justify;} .blocp1:hover > .imgfiche { filter:alpha(opacity=0); -moz-opacity:0; opacity: 0; } .blocp1{ overflow : hidden; position : relative; height: 320px; margin : auto; padding : auto; font-family : Poiret One; text-align : justify; font-size : 16px; color : ivory; width : 250px; } .bts { position : relative; height: 320px; width : 440px; margin : auto; padding : auto; font-family : Poiret One; text-align : justify; font-size : 16px; color : ivory; } .titre1 { font-family : Trade Winds; font-size : 35px; font-weight : bold; text-align : center; margin : auto; color : ivory; margin : auto; } .titre2 { font-family : Trade Winds; font-size : 35px; font-weight : bold; text-align : center; margin : auto; color : #8c0001; margin : auto; } .phypsy { margin : auto; padding : auto; font-family : Poiret One; text-align : justify; font-size : 16px; color : ivory; border : none; height : 400px; width : 45%; background-color : #8c0001; cellspacing : 0px; cellpadding : 0px; } .histperso { margin : auto; padding : auto; font-family : Poiret One; text-align : justify; font-size : 16px; color : ivory; border : none; height : auto; background-color : #8c0001; cellspacing : 0px; cellpadding : 0px; } .psyperso { margin : auto; padding : auto; font-family : Poiret One; text-align : justify; font-size : 16px; color : ivory; border : none; height : auto; background-color : #a4a0a1; cellspacing : 0px; cellpadding : 0px; } .nomprenom { font-family : Cinzel; font-size : 35px; font-weight : bold; text-align : center; margin : auto; color : ivory; margin : auto; text-shadow : 0px 5px 0px black; }
</style>

<div class="bgprésa"><br><div class="nomprenom">Prénom P. Nom</div>
<br><table class="table1"><tr><td class="left1"><div class="blocp1">
<br><blockquote><span class="info1">Nom : </span>Ici
<br><span class="info1">Prénom : </span>Ici
<br><span class="info1">Âge : </span>Ici
<br><span class="info1">Sexe : </span>Ici
<br><span class="info1">Origine : </span>Ici
<br><span class="info1">Statut : </span>Ici</blockquote><div class="imgfiche"><img src="http://i21.servimg.com/u/f21/17/27/88/15/img_fi10.png" width="250" height="320"></div></div></td><td class="right1"><div class="bts">
<br><center><span class="titre2">Behind the screen</span></center>
<br><blockquote><span class="info1">Un pseudo : </span>Ici
<br><span class="info1">Un âge : </span>Ici
<br><span class="info1">Comment tu nous as connu ? </span>Ici
<br><span class="info1">Le code du réglo ? </span>Ici
<br><span class="info1">Des commentaires ? </span>Ici
<br><span class="info1">???: </span>Ici</blockquote>
</div></td></tr></table><table class="table"><tr><td class="phypsy"><center><span class="titre1">Magie</span></center>
<br><blockquote>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In condimentum purus venenatis ipsum feugiat vehicula. Praesent eleifend risus non vehicula rhoncus. Aenean in facilisis nibh. Proin luctus diam in magna aliquam, vel congue turpis tempus. Morbi at turpis massa. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce vulputate augue nec eros iaculis blandit. Praesent sodales turpis ut velit efficitur congue. Sed in turpis vitae libero facilisis egestas. Aenean pulvinar facilisis mauris, vitae accumsan diam aliquam eu.</blockquote></td><td class="phypsy"><center><span class="titre1">Physique</span></center>
<br><blockquote>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In condimentum purus venenatis ipsum feugiat vehicula. Praesent eleifend risus non vehicula rhoncus. Aenean in facilisis nibh. Proin luctus diam in magna aliquam, vel congue turpis tempus. Morbi at turpis massa. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce vulputate augue nec eros iaculis blandit. Praesent sodales turpis ut velit efficitur congue. Sed in turpis vitae libero facilisis egestas. Aenean pulvinar facilisis mauris, vitae accumsan diam aliquam eu.</blockquote></td></tr><tr><td colspan="2" class="psyperso"><br><br><center><span class="titre2">Psychologie</span></center>
<br><blockquote>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In condimentum purus venenatis ipsum feugiat vehicula. Praesent eleifend risus non vehicula rhoncus. Aenean in facilisis nibh. Proin luctus diam in magna aliquam, vel congue turpis tempus. Morbi at turpis massa. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce vulputate augue nec eros iaculis blandit. Praesent sodales turpis ut velit efficitur congue. Sed in turpis vitae libero facilisis egestas. Aenean pulvinar facilisis mauris, vitae accumsan diam aliquam eu.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In condimentum purus venenatis ipsum feugiat vehicula. Praesent eleifend risus non vehicula rhoncus. Aenean in facilisis nibh. Proin luctus diam in magna aliquam, vel congue turpis tempus. Morbi at turpis massa. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce vulputate augue nec eros iaculis blandit. Praesent sodales turpis ut velit efficitur congue. Sed in turpis vitae libero facilisis egestas. Aenean pulvinar facilisis mauris, vitae accumsan diam aliquam eu.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In condimentum purus venenatis ipsum feugiat vehicula. Praesent eleifend risus non vehicula rhoncus. Aenean in facilisis nibh. Proin luctus diam in magna aliquam, vel congue turpis tempus. Morbi at turpis massa. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce vulputate augue nec eros iaculis blandit. Praesent sodales turpis ut velit efficitur congue. Sed in turpis vitae libero facilisis egestas. Aenean pulvinar facilisis mauris, vitae accumsan diam aliquam eu.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In condimentum purus venenatis ipsum feugiat vehicula. Praesent eleifend risus non vehicula rhoncus. Aenean in facilisis nibh. Proin luctus diam in magna aliquam, vel congue turpis tempus. Morbi at turpis massa. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce vulputate augue nec eros iaculis blandit. Praesent sodales turpis ut velit efficitur congue. Sed in turpis vitae libero facilisis egestas. Aenean pulvinar facilisis mauris, vitae accumsan diam aliquam eu.</blockquote></td></tr>
<tr><td colspan="2" class="histperso"><br><br><center><span class="titre1">Histoire</span></center>
<br><blockquote>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In condimentum purus venenatis ipsum feugiat vehicula. Praesent eleifend risus non vehicula rhoncus. Aenean in facilisis nibh. Proin luctus diam in magna aliquam, vel congue turpis tempus. Morbi at turpis massa. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce vulputate augue nec eros iaculis blandit. Praesent sodales turpis ut velit efficitur congue. Sed in turpis vitae libero facilisis egestas. Aenean pulvinar facilisis mauris, vitae accumsan diam aliquam eu.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In condimentum purus venenatis ipsum feugiat vehicula. Praesent eleifend risus non vehicula rhoncus. Aenean in facilisis nibh. Proin luctus diam in magna aliquam, vel congue turpis tempus. Morbi at turpis massa. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce vulputate augue nec eros iaculis blandit. Praesent sodales turpis ut velit efficitur congue. Sed in turpis vitae libero facilisis egestas. Aenean pulvinar facilisis mauris, vitae accumsan diam aliquam eu.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In condimentum purus venenatis ipsum feugiat vehicula. Praesent eleifend risus non vehicula rhoncus. Aenean in facilisis nibh. Proin luctus diam in magna aliquam, vel congue turpis tempus. Morbi at turpis massa. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce vulputate augue nec eros iaculis blandit. Praesent sodales turpis ut velit efficitur congue. Sed in turpis vitae libero facilisis egestas. Aenean pulvinar facilisis mauris, vitae accumsan diam aliquam eu.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In condimentum purus venenatis ipsum feugiat vehicula. Praesent eleifend risus non vehicula rhoncus. Aenean in facilisis nibh. Proin luctus diam in magna aliquam, vel congue turpis tempus. Morbi at turpis massa. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce vulputate augue nec eros iaculis blandit. Praesent sodales turpis ut velit efficitur congue. Sed in turpis vitae libero facilisis egestas. Aenean pulvinar facilisis mauris, vitae accumsan diam aliquam eu.</blockquote></td></tr>
</table></div>

Revenir en haut
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum