AccueilFAQRechercherMembresGroupesS'enregistrerConnexion

Partagez | 
 

 Dev Nerd Girl #1 - Fiche de Liens (Intro)

Voir le sujet précédent Voir le sujet suivant Aller en bas 
AuteurMessage
Maître de Jeu
~ MJ ~
avatar

Messages : 45
Date d'inscription : 24/08/2008

Feuille de personnage
Personnage:
Niveau:
30/30  (30/30)
Inventaire:

MessageSujet: Dev Nerd Girl #1 - Fiche de Liens (Intro)   Lun 2 Jan - 13:33

Fiche de liens # 02 - Intro - Inspiré de Watch Dogs

Taille : 500px de large
Code modifiable : Non
Image modifiable : Oui (90px de hauteur, 79px de largeur) /!\
Contenu modifiable : Oui

Conseil de modifications :

¤ Repérez les balises “START SEARCH” et “END SEARCH” pour ajouter de nouveaux liens recherchés

¤ L'entête fait 450px de large mais elle est automatiquement redimensionnée. Les petites images doivent absolument faire 79px (largeur) * 90px (hauteur) !

¤ Evitez de passer des lignes là où il n’y en a pas de base, ça risque de déformer la fiche vu que forumactif ne compte pas ça comme du HTML.

¤ Vous pouvez modifier le code en live en cliquant sur “Edit on Codepen” (C'est même fort conseillé car le code est assez compliqué)

¤ /!\ NE PAS COPIER OU MODIFIER LE CSS : Normalement, vous pouvez pas le voir. Sinon, laissez le tranquille. Vous verrez, c’est magique. Copiez/collez juste le HTML.

¤ /!\ ET NE PAS ENLEVER LES CREDITS. Si j'en vois un qui enlève encore les crédits, je lui pète les jambes. (J'en ai vu, je n'aime pas ça ! J'vous ai à l'oeil O_O)

_________________


Dernière édition par Maître de Jeu le Lun 2 Jan - 13:43, édité 2 fois
Revenir en haut Aller en bas
Voir le profil de l'utilisateur http://halveras.forumactif.org
Maître de Jeu
~ MJ ~
avatar

Messages : 45
Date d'inscription : 24/08/2008

Feuille de personnage
Personnage:
Niveau:
30/30  (30/30)
Inventaire:

MessageSujet: Re: Dev Nerd Girl #1 - Fiche de Liens (Intro)   Lun 2 Jan - 13:33

Code:
<link href='http://codepen.io/devnerdgirl/pen/azymPp.css' rel='stylesheet' type='text/css'><div class="gly-fiche-02-wd"><div class="body"><div class="title-img"><!-- IMG ENTETE (450*??) --><img src="https://36.media.tumblr.com/e654334490cd5a73c25e30630010d620/tumblr_nco4sdPwBU1r4da47o1_1280.jpg" width="450px"/><!-- FIN IMG ENTETE (450*??) --></div><div class="title"><span class="primary">Citation</span><br/><span class="secondary">Fin de citation</span></div><div class="identity-holder"><div class="left-panel"><div class="app"><span class="name">Profiler_App</span><span class="ver">v0.3.0.1</span></div><div class="img"><!-- IMG (79*90) --><img src="http://img11.hostingpics.net/pics/96697620150128131922.jpg" /><!-- FIN IMG (79*90) --><div class="topleft-arrow"></div><div class="botright-arrow"></div></div><div class="flavour"><div class="primary"><a href="#">Profil</a> ♦ <a href="#">Fiche</a></div><div class="secondary"><a href="#">Contact</a></div></div></div><div class="right-panel"><div class="description"><div class="desc-block"><span class="text-desc">Description courte du personnage</span></div></div><div class="name"><span class="text">Nom, prénom</span></div><div class="interest"><div class="arrow"></div><span class="text">Something to say</span></div><div class="stats"><div class="stats-desc"><span class="text-invert">Age: ??</span></div><div class="stats-desc"><span class="text-invert">Occupation: ...</span></div><div class="stats-desc"><span class="text-invert">Interests: ...</span></div></div></div><div class="clear"></div></div><div class="title"><span class="primary">More</span><br/><span class="secondary">About Me</span></div><div class="block"><div class="block-text"><div style="max-height: 250px; padding: 0 5px; overflow: auto;">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Culpa cum ducimus earum, eius eos exercitationem explicabo, iure labore molestias nam neque nihil nobis odit praesentium quaerat repellat sed sequi, vero. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Culpa cum ducimus earum, eius eos exercitationem explicabo, iure labore molestias nam neque nihil nobis odit praesentium quaerat repellat sed sequi, vero. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Culpa cum ducimus earum, eius eos exercitationem explicabo, iure labore molestias nam neque nihil nobis odit praesentium quaerat repellat sed sequi, vero.</div></div></div><div class="title"><span class="primary">If you really want to know</span><br/><span class="secondary">I search them</span></div><div class="block"><div class="block-text"><!-- START SEARCH --><span style="color: #34dddd">Nom du lien</span><div style="max-height: 90px; padding: 0 5px; overflow: auto;">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Culpa cum ducimus earum, eius eos exercitationem explicabo, iure labore molestias nam neque nihil nobis odit praesentium quaerat repellat sed sequi, vero.</div><br/><!-- END SEARCH --><!-- START SEARCH --><span style="color: #34dddd">Nom du lien</span><div style="max-height: 90px; padding: 0 5px; overflow: auto;">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Culpa cum ducimus earum, eius eos exercitationem explicabo, iure labore molestias nam neque nihil nobis odit praesentium quaerat repellat sed sequi, vero.</div><!-- END SEARCH --></div></div></div><div class="credits">Fiche by <a href="http://devnerdgirl-rpgstuff.tumblr.com">Dev Nerd Girl</a></div></div>

_________________
Revenir en haut Aller en bas
Voir le profil de l'utilisateur http://halveras.forumactif.org
Maître de Jeu
~ MJ ~
avatar

Messages : 45
Date d'inscription : 24/08/2008

Feuille de personnage
Personnage:
Niveau:
30/30  (30/30)
Inventaire:

MessageSujet: Re: Dev Nerd Girl #1 - Fiche de Liens (Intro)   Lun 2 Jan - 13:33

Citation
Fin de citation
Profiler_Appv0.3.0.1
Description courte du personnage
Nom, prénom
Something to say
Age: ??
Occupation: ...
Interests: ...
More
About Me
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Culpa cum ducimus earum, eius eos exercitationem explicabo, iure labore molestias nam neque nihil nobis odit praesentium quaerat repellat sed sequi, vero. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Culpa cum ducimus earum, eius eos exercitationem explicabo, iure labore molestias nam neque nihil nobis odit praesentium quaerat repellat sed sequi, vero. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Culpa cum ducimus earum, eius eos exercitationem explicabo, iure labore molestias nam neque nihil nobis odit praesentium quaerat repellat sed sequi, vero.
If you really want to know
I search them
Nom du lien
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Culpa cum ducimus earum, eius eos exercitationem explicabo, iure labore molestias nam neque nihil nobis odit praesentium quaerat repellat sed sequi, vero.

Nom du lien
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Culpa cum ducimus earum, eius eos exercitationem explicabo, iure labore molestias nam neque nihil nobis odit praesentium quaerat repellat sed sequi, vero.
Fiche by Dev Nerd Girl

_________________
Revenir en haut Aller en bas
Voir le profil de l'utilisateur http://halveras.forumactif.org
Contenu sponsorisé




MessageSujet: Re: Dev Nerd Girl #1 - Fiche de Liens (Intro)   

Revenir en haut Aller en bas
 
Dev Nerd Girl #1 - Fiche de Liens (Intro)
Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 1 sur 1
 Sujets similaires
-
» [Codage] Fiche de liens et Rp - Matt MacAlister [Terminé - Louna Blake ]
» ? Comment faire une fiche de liens ?
» Fiche de liens
» CODE LIBRE SERVICE DE FICHE DE LIENS
» Libre Service de Fiche

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
Le monde d'Halvéras :: Mise en bouche :: Codage Test-
Sauter vers: