:: HORS JEUX :: FLOOD Voir le sujet précédent Voir le sujet suivant Aller en bas

Les codes de Diane o/

avatar
Diane Biela
Directrice de Méridius et professeur de magie élémentaire - Mage 2nd ordre
Age du personnage : Plusieurs centaines d'années
Race : Vampire
Pouvoirs : Pouvoir raciaux
Voir le profil de l'utilisateur
Sam 13 Mai - 12:02



Bonjour, bonsoir à tous !


Bon voilà dans la vie j'ai plusieurs passions. La première, c'est manger, mais on est pas là pour ça. L'un de mes passe-temps favoris, c'est coder des trucs pour des forums. (En général des réponses RP, mais ça m'arrive de faire autre chose).
Et vu que je suis très très partageuse, je fais toujours un petit topic dans le flood ou y'a tout mes codes avec les explications pour pouvoir les modifier. Alors il se peut que des professionnels me crachent dessus et c'est compréhensible parce que je pense que mes codes sont très mal optimisés. Maiiiis... c'est le mieux que je puisse faire.
Les seuls exigences que j'ai c'est de ne pas retirer ou modifier le copyright tout en bas. Il est petit et discret exprès pour pas qu'on ne le remarque trop, donc soyez gentils merci.
Je prend toutes les suggestions et idées de design de code ainsi que les commandes à partir du moment qu'elles m'inspirent. Je me réserve donc le droit de rejeter une commande si je ne trouve pas de concept qui me plait !

Bon déjà si ce type de code vous plaît, je vous donne le code en bas de ce post ci.
Je le recommande pour des utilisations en message officiels, annonce ou même réponse RP même s'il est un peu simple. Tout ce qui est dans la balise "style" concerne l'apparence... Chaque class a son nom et il est important de ne pas changer les noms sans savoir les conséquences.
Mais Diane ? Qu'est-ce que c'est qu'une class ? Et bien mon enfant, c'est bien simple. Une class, c'est un nom qu'on va donner à une div (grosso modo une div c'est un bloc auquel on peut affecter des "options") et à chaque fois qu'on modifiera quelque chose dans la class, ça modifiera la div qui porte son nom ! Ça a l'air compliqué mais c'est probablement parce que je sais pas expliquer... Enfin bref ! Les "options" d'une class ça peut être tout et n'importe quoi (ou presque). Par exemple si on veut que ce soit écrit d'une certaine couleur on écrira color: #000000; pour écrire en noir ! text-shadow: 2px 2px 4px black; permet de faire une ombre sous un texte etc...
De toute façon si vous avez des questions vous pouvez me les poser en MP ou même à la suite de ce topic ! D'ailleurs je sais pas si c'est problématique, mais je risque de souvent faire des doubles posts pour éviter d'avoir trop de code dans le même post et que ça pose des problèmes de conflits...
Voilà voilà, je me doute bien que tout le monde n'aura pas lu mon pavé (Pavé César, ce qui ne t'ont pas lu te salut !) mais j'espère que vous vous amuserez bien à imaginer des designs, modifier mes codes et autres ! Merci à vous !


© RenA



Code:

<link href="https://fonts.googleapis.com/css?family=Libre+Baskerville|Lobster" rel="stylesheet">
<style>.backgrounda{width: 530px; border: 2px solid grey;  padding: 5px; margin: auto;} .titrea{text-align: center; font-size: 32px; font-family: 'Lobster', cursive; text-shadow: 2px 2px 4px grey;} .bloca{width: 400px; margin: auto; text-align: justify; font-family: 'Libre Baskerville', serif;}</style>
<div class="backgrounda">
<div class="titrea">Titre du post, salutation, comme vous voulez.</div>

<div class="bloca">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam libero ex, laoreet sit amet libero ut, feugiat egestas leo. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Integer tristique pretium lacus, eget tincidunt mauris varius vitae. Aliquam id sollicitudin nunc, ac gravida odio. Fusce aliquam lectus quis sagittis venenatis. Vestibulum neque metus, convallis in magna ut, varius sagittis sem. Phasellus sed pretium nulla. In id dolor pretium, congue felis eu, congue diam. Aliquam tristique sodales libero, quis rutrum magna pretium non. Nullam ultricies euismod ultricies. Fusce lacinia felis est, placerat sodales lectus hendrerit ac. Donec quis ante consectetur, pellentesque eros sodales, pulvinar nisi. Ut nec nisl et eros volutpat sollicitudin.

Vestibulum faucibus dictum molestie. Suspendisse convallis vestibulum justo, eu porta elit placerat eget. Quisque finibus tristique eros ac laoreet. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec justo lorem, tempus pretium ante dapibus, dignissim consectetur metus. Mauris efficitur semper maximus. Donec felis ex, lacinia sed placerat ac, tincidunt eget mauris. Phasellus aliquet odio mauris, vitae sagittis mi varius ac. Etiam vitae tristique mi, non dapibus ligula. Phasellus commodo neque sed fringilla bibendum.

Morbi venenatis enim sed quam aliquam imperdiet. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec non eleifend tortor. Suspendisse volutpat sed justo et malesuada. Sed eleifend dignissim accumsan. Donec luctus nisi eu justo maximus congue. Nulla rutrum ligula eu pharetra tempor. Fusce et felis non mauris finibus laoreet facilisis ut felis. Proin ac eros et enim lobortis rhoncus. Nulla porttitor molestie dolor, quis tincidunt erat laoreet ac. Aliquam pulvinar nisl neque, quis efficitur orci vehicula ac. Etiam suscipit id lacus ac porttitor. In dignissim ipsum risus. Morbi mauris eros, mollis sed libero eu, luctus blandit ex. Sed et mattis metus.</div>
<div style="text-align: right; font-size: 8px; color: grey; margin-right: 5px;">
© RenA
</div>
</div>





[Vous devez être inscrit et connecté pour voir cette image]
Far from perfect, she's just a wretch
Revenir en haut Aller en bas
avatar
Diane Biela
Directrice de Méridius et professeur de magie élémentaire - Mage 2nd ordre
Age du personnage : Plusieurs centaines d'années
Race : Vampire
Pouvoirs : Pouvoir raciaux
Voir le profil de l'utilisateur
Sam 13 Mai - 12:21



Et on enchaîne directement avec le second code !


Ouiiii... Je sais... ça fait pas longtemps que j'ai posté (à peine quelques minutes à vrai dire) mais étant donné que j'ai codé celui pour les messages ce matin en deux temps trois mouvements et un hier soir pour les présentations, bah...
Ahem ahem. Il faut bien que je fasse partager hein ! Donc voilà, Astoria, petite mention pour toi, si tu veux l'utiliser comme modèle de présentation n'hésite pas,
c'est gratuit ! Faudrait juste mettre la balise style dans la feuille css du forum,
mais c'est pas sorcier, t'inquiète. (C'est pour simplifier).
Pour la petite histoire, Caelia m'a montré le forum et je me suis dis "cool, Poudlard avec des créatures". A la base je voulais faire une incarnat, mais elle m'a bitchslap avant que je ne puise dire mot et elle m'a dit que c'était réservé à elle. Vu que j'aime bien la diversité *tousse*, je me suis dis que j'allais faire un vampire. A la base je voulais qu'elle ai la phobie du sang pis je me suis dis que ça allait compliquer les choses juste pour un peu de fun... donc juste un vampire normal. Bref je m'égare !
Où est-ce que j'en étais ? Ah ! Le code ! Exact...
Cliquez ici:






Diane Biela


IDENTITÉ DU PERSONNAGE



Espèce :  X

Age : X

Orientation sexuelle : X

Originaire de Targatt ? Oui- Non
♠ Si oui, êtes-vous affiliés à une des familles régnantes ? Laquelle ? : x
♠ Si non, quand y êtes-vous arrivés ? : x

Métier ? (professeur, gardien, préfet...)

Alignement du personnage : (Loyal Bon / Neutre Bon / Chaotique Bon / Loyal Neutre / Neutre / Chaotique Neutre / Loyal Mauvais / Neutre Mauvais / Chaotique Mauvais )

Voulez-vous un rôle important dans la trame en cours ? Si oui, côté défenseurs ou "méchants" ? : X


[Vous devez être inscrit et connecté pour voir cette image]


POUVOIRS


Energie magique canalisée : Positive/Négative/Neutre

Pouvoir personnel 1 : (expliquez en quoi il consiste, ses forces, faiblesses etc sachant qu'il s'agit là de votre pouvoir parfaitement maîtrisé)

Pouvoir personnel 2 : (expliquez en quoi il consiste, ses forces, faiblesses etc sachant qu'il s'agit là de votre pouvoir parfaitement maîtrisé)

Type de magie préférée : (expliquez en quoi il consiste, quelles sont ses faiblesses, sachant que vous ne le maîtrisez pas totalement - hormis les directeurs de maisons et chefs des familles régnantes)

Type de magie que vous ne connaissez pas du tout : (avec lesquelles vous avez l'habitude d'agir, en nommer deux)


[Vous devez être inscrit et connecté pour voir cette image]


CARACTÉRISTIQUES



Vous disposez de 70 points à répartir comme vous le souhaitez. Si vous êtes un directeur ou un personnage spécial pour la trame, vous pouvez avoir jusqu'à 80 points à répartir. Les caractéristiques ne sont là que pour aider au jeu à voir quelles sont vos points forts et faibles.

Force : x

Constitution : x

Dextérité : x

Intelligence : x

Sagesse : x

Charisme : x

[Vous devez être inscrit et connecté pour voir cette image]


VOTRE PERSONNAGE



Biographie :
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi et tincidunt ipsum. Aenean lacinia eleifend cursus. Ut auctor sit amet mauris et gravida. Integer turpis ante, pretium quis posuere sed, convallis ultricies nulla. Pellentesque sit amet vestibulum leo. Proin ac metus ultrices, consequat risus sed, consequat turpis. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Pellentesque id dignissim ex. Sed at ipsum porttitor, ultrices tellus placerat, consequat ex. Ut ut scelerisque mauris, nec dapibus odio. Nulla enim augue, tempus in vulputate quis, congue ac neque. Praesent eget sem dolor. Nunc et nunc ornare, blandit eros ut, mollis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nam gravida lectus sit amet metus mattis tempus.

Aliquam et convallis nibh, at pellentesque diam. Vestibulum accumsan cursus magna at vulputate. Nulla sit amet nisi quis purus molestie euismod non sed purus. Phasellus accumsan libero ac nulla hendrerit mollis. Nunc tortor nulla, imperdiet pulvinar nisi a, cursus volutpat ex. Maecenas volutpat tincidunt arcu, ut feugiat nulla ullamcorper vel. Maecenas sit amet turpis interdum, finibus ex a, viverra lorem. Nunc bibendum nibh dictum sem efficitur mattis vestibulum et dui.

Description physique :
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi et tincidunt ipsum. Aenean lacinia eleifend cursus. Ut auctor sit amet mauris et gravida. Integer turpis ante, pretium quis posuere sed, convallis ultricies nulla. Pellentesque sit amet vestibulum leo. Proin ac metus ultrices, consequat risus sed, consequat turpis. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Pellentesque id dignissim ex. Sed at ipsum porttitor, ultrices tellus placerat, consequat ex. Ut ut scelerisque mauris, nec dapibus odio. Nulla enim augue, tempus in vulputate quis, congue ac neque. Praesent eget sem dolor. Nunc et nunc ornare, blandit eros ut, mollis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nam gravida lectus sit amet metus mattis tempus.

Aliquam et convallis nibh, at pellentesque diam. Vestibulum accumsan cursus magna at vulputate. Nulla sit amet nisi quis purus molestie euismod non sed purus. Phasellus accumsan libero ac nulla hendrerit mollis. Nunc tortor nulla, imperdiet pulvinar nisi a, cursus volutpat ex. Maecenas volutpat tincidunt arcu, ut feugiat nulla ullamcorper vel. Maecenas sit amet turpis interdum, finibus ex a, viverra lorem. Nunc bibendum nibh dictum sem efficitur mattis vestibulum et dui.
Description mentale :
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi et tincidunt ipsum. Aenean lacinia eleifend cursus. Ut auctor sit amet mauris et gravida. Integer turpis ante, pretium quis posuere sed, convallis ultricies nulla. Pellentesque sit amet vestibulum leo. Proin ac metus ultrices, consequat risus sed, consequat turpis. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Pellentesque id dignissim ex. Sed at ipsum porttitor, ultrices tellus placerat, consequat ex. Ut ut scelerisque mauris, nec dapibus odio. Nulla enim augue, tempus in vulputate quis, congue ac neque. Praesent eget sem dolor. Nunc et nunc ornare, blandit eros ut, mollis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nam gravida lectus sit amet metus mattis tempus.

Aliquam et convallis nibh, at pellentesque diam. Vestibulum accumsan cursus magna at vulputate. Nulla sit amet nisi quis purus molestie euismod non sed purus. Phasellus accumsan libero ac nulla hendrerit mollis. Nunc tortor nulla, imperdiet pulvinar nisi a, cursus volutpat ex. Maecenas volutpat tincidunt arcu, ut feugiat nulla ullamcorper vel. Maecenas sit amet turpis interdum, finibus ex a, viverra lorem. Nunc bibendum nibh dictum sem efficitur mattis vestibulum et dui.

[Vous devez être inscrit et connecté pour voir cette image]


LE JOUEUR





Votre prénom : x

Votre âge : x

Quelle est votre expérience des jeux de rôles ? x

Quelle sera votre fréquence de connexion ? x




© RenA


Bon ça casse un peu le forum quand on ouvre, mais bon c'est pas trop trop grave, vous pouvez refermer le spoiler. Donc voilà, on introduit une nouvelle notion : les :hover. MAIS QU'EST-CE DONC QUE CETTE CHOSE DIANE ? C'est très simple mon petit pissenlit, c'est quelque chose qui concerne la div quand on passe la souris dessus. Elle peut changer de couleur, de forum, de taille etc... Magnifique n'est-ce pas ?
Pour ce code j'ai essayé de reprendre au maximum celui de base pour garder la même idée. A la base je voulais faire un truc simple pis j'me suis dis "Si je dois le refaire, je refais tout bien !"... Du coup du code de base il ne reste que les couleurs et la taille... J'espère quand même qu'il vous plait et je met le code en bas ! Et... voilà !
Je vous déconseille de mettre des retour à la ligne n'importe où entre les divs ou dans la balise style. Enfin vous pouvez, mais je viendrais pas réparer le code parce que vous vous êtes ratés ! Vous êtes prévenus ! Sur ce, à la prochaine, n'hésitez pas à m'envoyer des idées de design par MP ou à la suite de ce post !



© RenA



Code:
<link href="https://fonts.googleapis.com/css?family=Inknut+Antiqua|Source+Sans+Pro|Lemonada" rel="stylesheet">

<style>.titre{text-align: center; text-shadow: 1px 1px 2px black; font-family: 'Inknut Antiqua', serif; font-size: 24px; color: #777d81; transition: all .4s ease-in-out;} .titre:hover{transform: scale(1.15); letter-spacing: 1px;} .nom{font-family: 'Lemonada', cursive; font-size: 32px; text-align: center; padding-bottom: 5px; color: #777d81;text-shadow: 1px 1px 2px black;transition: all .4s ease-in-out;} .nom:hover{letter-spacing: 2px;} .background{background-image: url('https://image.freepik.com/free-vector/grey-linen-texture-background_1053-253.jpg'); width: 530px;border: 3px solid #3C3C3C;border-radius: 20px 0px 20px 0px; margin: auto;} .blocbase{width: 400px; background-color: #E7E8E8; box-shadow: 2px 2px 4px black; border: 2px solid #3C3C3C; color: #777d81; margin: auto; transition: all .4s ease-in-out; padding: 3px; text-align: justify; font-family: 'Source Sans Pro', sans-serif;} .blocbase:hover{transform: scale(1.1);} .personnage{ width: 155px;height:300px; background-color:#E7E8E8; box-shadow: 2px 2px 4px black; border: 2px solid #3C3C3C; margin-left: 10px; color: #777d81; display: inline-block; transition: all .4s ease-in-out; text-align: justify; padding: 2px; overflow: hidden; font-family: 'Source Sans Pro', sans-serif;} .personnage:hover{ transform: scale(1.5);} .scroll{width: 110%; height: 100%; overflow-y: scroll; padding-right: 10%;}</style>
<div class="background"><br />
<div class="nom"> Diane Biela </div><div style="border-bottom: 4px solid #3C3C3C;"></div>

<div class="titre">IDENTITÉ DU PERSONNAGE </div>

<div class="blocbase">
[b]• [u]Espèce[/u] :[/b]  X

[b]• [u]Age[/u] :[/b] X

[b]• [u]Orientation sexuelle[/u] :[/b] X

[b]• [u]Originaire de Targatt [/u]?[/b] Oui- Non
[b][i]♠ Si oui, êtes-vous affiliés à une des familles régnantes ? Laquelle ?[/i][/b] : x
[b][i]♠ Si non, quand y êtes-vous arrivés ?[/i][/b] : x

[b]• [u]Métier[/u] ?[/b] (professeur, gardien, préfet...)

[b]• [u]Alignement du personnage :[/u][/b] (Loyal Bon / Neutre Bon / Chaotique Bon / Loyal Neutre / Neutre / Chaotique Neutre / Loyal Mauvais / Neutre Mauvais / Chaotique Mauvais )

[b]• [u]Voulez-vous un rôle important dans la trame en cours ? Si oui, côté défenseurs ou "méchants" ?[/u][/b] : X

</div>
<div style=" width: 300px; height: 62px; margin-left: 115px;">[img]https://img4.hostingpics.net/pics/604575stickerarabesque0023.png[/img]</div>

<div class="titre">POUVOIRS </div>
<div class="blocbase">
[b]• [u]Energie magique canalisée[/u] :[/b] Positive/Négative/Neutre

[b]• [u]Pouvoir personnel 1[/u] :[/b] (expliquez en quoi il consiste, ses forces, faiblesses etc sachant qu'il s'agit là de votre pouvoir parfaitement maîtrisé)

[b]• [u]Pouvoir personnel 2[/u] :[/b] (expliquez en quoi il consiste, ses forces, faiblesses etc sachant qu'il s'agit là de votre pouvoir parfaitement maîtrisé)

[b]• [u]Type de magie préférée[/u] :[/b] (expliquez en quoi il consiste, quelles sont ses faiblesses, sachant que vous ne le maîtrisez pas totalement - hormis les directeurs de maisons et chefs des familles régnantes)

[b]• [u]Type de magie que vous ne connaissez pas du tout[/u] :[/b] (avec lesquelles vous avez l'habitude d'agir, en nommer deux)

</div>
<div style=" width: 300px; height: 62px; margin-left: 115px;">[img]https://img4.hostingpics.net/pics/604575stickerarabesque0023.png[/img]</div>

<div class="titre">CARACTÉRISTIQUES</div>

<div class="blocbase">
Vous disposez de 70 points à répartir comme vous le souhaitez. Si vous êtes un directeur ou un personnage spécial pour la trame, vous pouvez avoir jusqu'à 80 points à répartir. Les caractéristiques ne sont là que pour aider au jeu à voir quelles sont vos points forts et faibles.

[b]• [u]Force :[/u][/b] x

[b]• [u]Constitution :[/u][/b] x

[b]• [u]Dextérité :[/u][/b] x

[b]• [u]Intelligence :[/u][/b] x

[b]• [u]Sagesse :[/u][/b] x

[b]• [u]Charisme :[/u][/b] x
</div>
<div style=" width: 300px; height: 62px; margin-left: 115px;">[img]https://img4.hostingpics.net/pics/604575stickerarabesque0023.png[/img]</div>

<div class="titre">VOTRE PERSONNAGE </div>


<div class="personnage"><div class="scroll">[b]• [u]Biographie :[/u][/b]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi et tincidunt ipsum. Aenean lacinia eleifend cursus. Ut auctor sit amet mauris et gravida. Integer turpis ante, pretium quis posuere sed, convallis ultricies nulla. Pellentesque sit amet vestibulum leo. Proin ac metus ultrices, consequat risus sed, consequat turpis. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Pellentesque id dignissim ex. Sed at ipsum porttitor, ultrices tellus placerat, consequat ex. Ut ut scelerisque mauris, nec dapibus odio. Nulla enim augue, tempus in vulputate quis, congue ac neque. Praesent eget sem dolor. Nunc et nunc ornare, blandit eros ut, mollis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nam gravida lectus sit amet metus mattis tempus.

Aliquam et convallis nibh, at pellentesque diam. Vestibulum accumsan cursus magna at vulputate. Nulla sit amet nisi quis purus molestie euismod non sed purus. Phasellus accumsan libero ac nulla hendrerit mollis. Nunc tortor nulla, imperdiet pulvinar nisi a, cursus volutpat ex. Maecenas volutpat tincidunt arcu, ut feugiat nulla ullamcorper vel. Maecenas sit amet turpis interdum, finibus ex a, viverra lorem. Nunc bibendum nibh dictum sem efficitur mattis vestibulum et dui.

</div></div><div class="personnage"><div class="scroll">[b]• [u]Description physique :[/u][/b]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi et tincidunt ipsum. Aenean lacinia eleifend cursus. Ut auctor sit amet mauris et gravida. Integer turpis ante, pretium quis posuere sed, convallis ultricies nulla. Pellentesque sit amet vestibulum leo. Proin ac metus ultrices, consequat risus sed, consequat turpis. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Pellentesque id dignissim ex. Sed at ipsum porttitor, ultrices tellus placerat, consequat ex. Ut ut scelerisque mauris, nec dapibus odio. Nulla enim augue, tempus in vulputate quis, congue ac neque. Praesent eget sem dolor. Nunc et nunc ornare, blandit eros ut, mollis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nam gravida lectus sit amet metus mattis tempus.

Aliquam et convallis nibh, at pellentesque diam. Vestibulum accumsan cursus magna at vulputate. Nulla sit amet nisi quis purus molestie euismod non sed purus. Phasellus accumsan libero ac nulla hendrerit mollis. Nunc tortor nulla, imperdiet pulvinar nisi a, cursus volutpat ex. Maecenas volutpat tincidunt arcu, ut feugiat nulla ullamcorper vel. Maecenas sit amet turpis interdum, finibus ex a, viverra lorem. Nunc bibendum nibh dictum sem efficitur mattis vestibulum et dui.
</div></div> <div class="personnage"><div class="scroll">[b]• [u]Description mentale :[/u][/b]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi et tincidunt ipsum. Aenean lacinia eleifend cursus. Ut auctor sit amet mauris et gravida. Integer turpis ante, pretium quis posuere sed, convallis ultricies nulla. Pellentesque sit amet vestibulum leo. Proin ac metus ultrices, consequat risus sed, consequat turpis. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Pellentesque id dignissim ex. Sed at ipsum porttitor, ultrices tellus placerat, consequat ex. Ut ut scelerisque mauris, nec dapibus odio. Nulla enim augue, tempus in vulputate quis, congue ac neque. Praesent eget sem dolor. Nunc et nunc ornare, blandit eros ut, mollis metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nam gravida lectus sit amet metus mattis tempus.

Aliquam et convallis nibh, at pellentesque diam. Vestibulum accumsan cursus magna at vulputate. Nulla sit amet nisi quis purus molestie euismod non sed purus. Phasellus accumsan libero ac nulla hendrerit mollis. Nunc tortor nulla, imperdiet pulvinar nisi a, cursus volutpat ex. Maecenas volutpat tincidunt arcu, ut feugiat nulla ullamcorper vel. Maecenas sit amet turpis interdum, finibus ex a, viverra lorem. Nunc bibendum nibh dictum sem efficitur mattis vestibulum et dui.
</div></div>
<div style=" width: 300px; height: 62px; margin-left: 115px;">[img]https://img4.hostingpics.net/pics/604575stickerarabesque0023.png[/img]</div>

<div class="titre">LE JOUEUR</div>



<div class="blocbase">
[b]• [u]Votre prénom : [/u][/b] x

[b]• [u]Votre âge :[/u][/b] x

[b]• [u]Quelle est votre expérience des jeux de rôles ?[/u][/b] x

[b]• [u]Quelle sera votre fréquence de connexion ? [/u][/b] x
</div>
</br>
<div style="text-align: right; font-size: 8px; color: black; margin-right: 5px;">
© RenA
</div></div>
Revenir en haut Aller en bas
avatar
Drake Leckard
Chef des Leckard, Maître de magie spirituelle - Archimage
Age du personnage : 56
Race : Humain
Pouvoirs : Abjuration et absoption
Voir le profil de l'utilisateur
Sam 13 Mai - 13:13
Je crois que c'est Astoria qui sera ravie de ce partage ^^

Merci à toi pour ta passion/dévotion à ton art Razz
Revenir en haut Aller en bas
avatar
Caelia Ene
Intendante des Leckard - Mage 3e ordre
Age du personnage : 490 ans
Race : Incarnat
Pouvoirs : Choc mental - Magie spirituelle et élémentaire
Voir le profil de l'utilisateur
Sam 13 Mai - 16:16
Diane : "Pour la petite histoire, Caelia m'a montré le forum et je me suis dis "cool, Poudlard avec des créatures". A la base je voulais faire une incarnat, mais elle m'a bitchslap avant que je ne puise dire mot et elle m'a dit que c'était réservé à elle. "

Je ne vois vraiment pas de quoi tu parles, ma grande ♥. (<.<) ... (>.>)

Il y a des chances que je te fasse une commande ce week-end (si j'y pense surtout) ~
Oui je sais, tu m'aimes Very Happy *fuis très loin*
Revenir en haut Aller en bas
avatar
Diane Biela
Directrice de Méridius et professeur de magie élémentaire - Mage 2nd ordre
Age du personnage : Plusieurs centaines d'années
Race : Vampire
Pouvoirs : Pouvoir raciaux
Voir le profil de l'utilisateur
Sam 13 Mai - 19:54
Une commande ?? Avec plaisir ! Je t'en prie envoie moi un MP sur le forum ou sur Discord ! :3 Évite de le faire demain par contre parce que je pense pas que je serai motivé.





[Vous devez être inscrit et connecté pour voir cette image]
Far from perfect, she's just a wretch
Revenir en haut Aller en bas
avatar
Diane Biela
Directrice de Méridius et professeur de magie élémentaire - Mage 2nd ordre
Age du personnage : Plusieurs centaines d'années
Race : Vampire
Pouvoirs : Pouvoir raciaux
Voir le profil de l'utilisateur
Sam 13 Mai - 21:27



3ème fois de la journée, si c'est pas de l'inspi ça !


Bon ok, j'arrête de mentir : c'est juste que c'est le weekend et que j'ai le temps. En semaine je serai moins active sur les codes, mais peu importe,
c'est le weekend, je profite !

Bon comme vous le savez tous, le but d'un forum RP c'est de faire... du RP ! Vous êtes surpris hein ? Et bah non, c'est pas meetic, c'est pas non plus pour faire cuire des oeufs. Donc pour cette fois ci, j'ai décidé que j'allais faire un code RP plutôt simpliste (j'avais pas l'inspi). En écrivant le code je me suis dis "Va falloir que j'ai la main moins lourde sur les effets hover" (ceux qu'ont bien appris leur leçon seront ce qu'est un hover) et pis finalement à mi chemin... J'ai voulu en rajouter partout, comme d'hab... Aaaahlala... Que je suis vilaaaaine.

Bref je vais pas vous faire patienter plus longtemps... Voilà donc le chef d'oe... *PAN* le code de cette fois ci.  ↓↓↓↓

C'est par là !:




Titre du RP




Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse at eleifend ipsum. Phasellus fringilla tempus placerat. Praesent faucibus sem volutpat leo vulputate tincidunt. Nulla eget auctor metus. Nullam tortor libero, scelerisque ac dignissim eu, tincidunt at turpis. Curabitur ipsum enim, sagittis et mi vel, ullamcorper vestibulum tellus. Proin sollicitudin sagittis libero, sed rhoncus risus porttitor et. Etiam nulla nisi, interdum a nulla eget, malesuada condimentum quam. Proin sit amet ipsum eget nibh varius semper. Maecenas aliquet eros felis, quis varius lorem sodales euismod. Cras vehicula convallis turpis. Morbi sed aliquam mauris.

Aliquam finibus orci nunc, auctor eleifend risus dapibus id. Duis nec orci non turpis mattis eleifend. Etiam laoreet metus sit amet risus mattis, sit amet suscipit eros dapibus. Aenean mollis sem interdum eros dignissim tristique. Suspendisse ac leo purus. Praesent hendrerit mollis tempus. Aenean eleifend tortor sed nibh venenatis gravida. Mauris sed orci sollicitudin risus imperdiet feugiat. Praesent sed tellus vel purus ornare euismod. Quisque ullamcorper urna non elit condimentum, sit amet feugiat eros porttitor. Sed vitae diam nec magna pharetra faucibus in efficitur sem.


© RenA

Encore une fois, le forum meurt un peu quand on ouvre le spoiler, mais bon c'est sous spoiler donc je devrais pas trop me faire taper sur les doigts... J'espère. Si je meurs, Caelia, efface mon historique s'il te plait.
Bref, pour cette fois ci, j'ai pas trop besoin de vous expliquer où vous devez écrire le titre du RP, ni où vous devez écrire le texte, je pense que c'est plutôt évident.
Cependant, pour les images vous allez devoir trouver dans la balise style. Vous le trouverez dans la classe .avataraa et .avatarab, sous le nom de background avec un url ensuite. Vous aurez juste à remplacer l'image par celle de votre choix. Ca peut être des images d'illustrations comme celle de vos partenaires RP... Comme vous voulez. L'image doit être de 150px par 150px, elle sera rognée si elle ne fait pas ces dimensions.

Comme d'habitude, si vous avez des suggestions, critiques ou idées à me soumettre, n'hésitez pas à répondre à la suite de ce topic ou par MP, comme vous voulez ! Merci pour votre lecture (シ_ _)シ



© RenA



Code:
<link href="https://fonts.googleapis.com/css?family=Lora|Montserrat" rel="stylesheet">

<style>.backgroundb{margin: auto; width: 550px; border: 2px solid #8B8A8C; box-shadow: 2px 2px 2px grey; background: url('http://www.webdesignburn.com/wp-content/uploads/2015/04/Grey-Texture-Background-and-Wallpaper-16.jpg')} .titreRPa{font-family: 'Lora', serif; font-size: 32px; color: grey; text-align: center; margin-top: 8px; transition: all .3s ease-in-out; text-shadow: 2px 2px 4px #8B8A8C;} .titreRPa:hover{transform: scale(1.2); letter-spacing: 1px;} .avataraa{width: 150px; height: 150px; border: 2px solid #8B8A8C; display: inline-block; margin-left: 125px; border-radius: 150px; transition: all .4s ease-in-out; background: url('https://orojackson.com/data/xengallery/14/14930-632c52b6d560573a5d6b52ab0b768448.jpg');  box-shadow: 2px 2px 3px #8B8A8C;} .avatarab{width: 150px; height: 150px; border: 2px solid #8B8A8C; display: inline-block; border-radius: 150px; transition: all .4s ease-in-out; background: url('https://orojackson.com/data/xengallery/14/14925-3f3521999a966fca7b5a875a698e2dd9.jpg?1473351937');  box-shadow: 2px 2px 3px #8B8A8C;} .avataraa:hover{ transform: translateX(-50px);} .avatarab:hover{transform: translateX(50px);} .blocb{width: 500px; margin: auto; border: 2px solid #8B8A8C; background: url('http://www.designbolts.com/wp-content/uploads/2013/02/Rough-Grey-Tilable-Pattern-For-Website-Background.jpg'); font-family: 'Montserrat', sans-serif; text-align: justify; color: grey; padding: 5px; transition: all .5s ease-in-out;} .blocb:hover{transform: scale(1.1);}</style>

<div class="backgroundb"><div class="titreRPa">Titre du RP</div>

<div class="avataraa"></div> <div class="avatarab"></div>

<div class="blocb">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse at eleifend ipsum. Phasellus fringilla tempus placerat. Praesent faucibus sem volutpat leo vulputate tincidunt. Nulla eget auctor metus. Nullam tortor libero, scelerisque ac dignissim eu, tincidunt at turpis. Curabitur ipsum enim, sagittis et mi vel, ullamcorper vestibulum tellus. Proin sollicitudin sagittis libero, sed rhoncus risus porttitor et. Etiam nulla nisi, interdum a nulla eget, malesuada condimentum quam. Proin sit amet ipsum eget nibh varius semper. Maecenas aliquet eros felis, quis varius lorem sodales euismod. Cras vehicula convallis turpis. Morbi sed aliquam mauris.

Aliquam finibus orci nunc, auctor eleifend risus dapibus id. Duis nec orci non turpis mattis eleifend. Etiam laoreet metus sit amet risus mattis, sit amet suscipit eros dapibus. Aenean mollis sem interdum eros dignissim tristique. Suspendisse ac leo purus. Praesent hendrerit mollis tempus. Aenean eleifend tortor sed nibh venenatis gravida. Mauris sed orci sollicitudin risus imperdiet feugiat. Praesent sed tellus vel purus ornare euismod. Quisque ullamcorper urna non elit condimentum, sit amet feugiat eros porttitor. Sed vitae diam nec magna pharetra faucibus in efficitur sem.</div>

<div style="text-align: right; color: black; font-size: 8px;">© RenA</div></div>
Revenir en haut Aller en bas
Page 1 sur 1

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
La Cité profane :: HORS JEUX :: FLOOD-
Sauter vers: