Mise en page RP

Partagez|
avatar
Personnel
  • Voir le profil de l'utilisateur
  • http://pensionmakeitcount.forumactif.com
Messages : 287
Date d'inscription : 10/05/2013

Feuille de personnage
Surnom: Jen'
Âge: 26
Chambre/Appartement: À la pension, au premier étage.
Hors ligne
Voici une mise en page, pour égayer tes RPs. Elle est facultative, libre à toi de l'utiliser, de choisir la tienne si tu t'y connais en codage ou d'en choisir une autre !

Code:
<style>.fiche_rp_makeitcount{width: 520px; height: 900px; background: url('https://www.zupimages.net/up/18/22/7coe.png'); margin: auto; text-align: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 15px; -webkit-box-sizing: border-box; box-sizing: border-box; -ms-flex-wrap: wrap; flex-wrap: wrap; position: relative;}.images_rp_post{width: 150px; height: 150px; border: 2px solid white; border-radius: 150px;}.infobulle_image_mic{width: 150px; height: 150px; border-radius: 150px; position: relative;}.infobulle_image_mic div{width: 150px; height: 150px; border-radius: 150px; position: absolute; top: 2px; left: 2px; background:rgba(255,255,255, 0.7); padding-top: 60px; -webkit-box-sizing: border-box; box-sizing: border-box; font-family: 'Georgia'; visibility: hidden; opacity: 0; -webkit-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s;}.infobulle_image_mic:hover div{visibility: visible; opacity: 1;}.fiche_rp_makeitcount h4{width: 100%; font-family: 'Cinzel'; font-size: 50px; color: white; text-shadow: 2px 2px 2px lightblue; margin-top: -10px; margin-bottom: -10px; font-weight: normal;}.content_rp_mic{width: 500px; height: 620px; background: #B2E2FA; position: relative;}.decoration_triangle{position: absolute; top: 0; left: 0;}.content_rp_mic p{text-align: justify; padding: 10px; width: 500px; height: 620px; font-family: 'Times New Roman'; color: #585858; font-size: 14px; line-height: 14px; overflow: auto; -webkit-box-sizing: border-box; box-sizing: border-box;}.copyright_fiche_mic{width: 300px; height: 25px; background: white; position: absolute; bottom: 0px; left: 105px; color: #B2E2FA; font-family: 'Arial'; font-size: 12px; padding-top: 6px; -webkit-box-sizing: border-box; box-sizing: border-box; font-style: oblique;}.copyright_fiche_mic a{text-decoration: none; color: #B2E2FA;}</style>

<link href="https://fonts.googleapis.com/css?family=Cinzel" rel="stylesheet"/><div class="fiche_rp_makeitcount"><img src="https://www.zupimages.net/up/18/17/7t8h.png" class="images_rp_post"/><div class="infobulle_image_mic"><img src="https://www.zupimages.net/up/18/17/7t8h.png" class="images_rp_post"/><div>Ft Pseudo</div></div><img src="https://www.zupimages.net/up/18/17/7t8h.png" class="images_rp_post"/><h4>Titre du RP</h4> <div class="content_rp_mic"><img src="https://www.zupimages.net/up/18/17/co6g.png" class="decoration_triangle"/><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec et elit vitae mi euismod elementum. Mauris pellentesque dui lorem, ut pretium tortor lacinia et. Donec lacinia viverra dui, in laoreet lorem congue vel. Aenean imperdiet rutrum lorem, nec molestie quam congue vel. Sed commodo nunc ac porttitor laoreet. Aenean dapibus nibh ac hendrerit finibus. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam iaculis vitae justo et eleifend. Fusce suscipit convallis quam, sed ultricies augue sodales a. Pellentesque luctus magna et rhoncus malesuada. Aenean sit amet arcu et elit elementum efficitur.Proin dignissim rhoncus ipsum ac fringilla. Phasellus laoreet ornare erat ut efficitur. Aenean nec est eu est ullamcorper posuere id eget lectus. Nullam vel laoreet turpis. Vivamus vulputate tortor nec ante imperdiet sagittis. Mauris sit amet nisl a erat blandit interdum. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Aliquam fringilla odio in turpis scelerisque lobortis. Pellentesque venenatis elit non nibh ultricies, a sagittis neque condimentum.Integer nec consequat dolor. Morbi semper mi venenatis ornare placerat. Cras tristique ex in enim feugiat, quis lobortis dui luctus. In ac suscipit nibh. Aenean at diam ac tortor dictum dictum vel eu lectus. Curabitur faucibus lectus ac dolor condimentum, id faucibus turpis volutpat. Curabitur interdum tincidunt tincidunt. Vivamus lorem ex, scelerisque vel velit ut, ornare vehicula quam. Vivamus semper felis gravida laoreet laoreet. Aliquam mi nulla, sagittis sit amet urna ac, varius placerat purus.</p></div><div class="copyright_fiche_mic">@Milou et @Artemis sur <a href="http://www.epicode-entraide.com/">epicode</a></div></div>

Soit

Spoiler:
 

Page 1 sur 1Revenir en haut
Sujets similaires
-
» J'ai besoin d'aide pour faire de jolie mise en page...
» Libre service de codes (mises en page RP)
» Formulaire de présentation d'un personnage inventé
» Mise en Page des NEWS KABAM
» Pourquoi la mise en page de mon message "saute" ?

 :: Un peu de paperasse :: ➺ Gestion du personnage :: Demandes de RP-
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum
Sauter vers: