Coder une fiche

Voir le sujet précédent Voir le sujet suivant Aller en bas

Coder une fiche

Message par Spartan D-129 le Sam 25 Mai - 6:57

Salut à toutes et à tous,

Aujourd'hui je vais vous apprendre à coder une fiche.

Nous allons donc prendre la fiche que j'ai créé pour le RP "Protection Raproché" avec Lucille Cole comme exemple.


Protection raproche




Lucille Cole


Voici ce qu'il y a derrière la fiche ci dessus :
Code:
<DIV style="background-image : url('') ; #FFFFFF ; border : solid 4px #000001 ; border-radius : 90% 90% 0% 0% ; width : 712px ; height : 85px ; text-shadow: 1px 1px 1px #262626 ; padding-left : 15px ; padding-right : 15px ; text-align : center ; padding-top : 15px;">
<font size=9 ; face=halo ; color=orange>P</font><font size=6 ; face=halo ; color=orange>rotection raproche</font></div><div style="background-image : url('http://d6.e-loader.net/vPb5I7P0CY.png') ; border : solid 4px #000001 ; border-radius: 3px ; width : 702px ; height : auto ; text-align : justify ; color : black ; padding : 10px 20px ;">

</div><DIV style="background-image : url('') ; #FFFFFF;border:solid 4px #000001;border-radius: 0% 0% 0% 00%; width:742px; height:100px ; text-align : center ; padding-top : 5px ;">

<font size=8 ; face=book antiqua ; color=red>Lucille Cole</font></div>
Vous ne comprenez surement rien à tous ces codes, je vais donc tout détailler :

__________

Tout d'abord, entrez cette ligne de code dans votre message :
Code:
<DIV style="background-image : url('') ; #000001 ; border : solid 0px #000001 ; border-radius : 0% 0% 0% 0% ; width : 0px ; height : 0px ; text-shadow: 0px 0px #000001 ; padding-left : 0px ; padding-right : 0px ; text-align : center ; padding-top : 0px"></div>

Après avoir mit ce code dans votre message, vous allez pouvoir modifier votre fiche :

  • Pour mettre une image en arrière plan, ajouter l'URL de celle-ci dans la parenthèse avec les deux apostrophes comme ceci : url('http://d6.e-loader.net/vPb5I7P0CY.png')

  • Pour mettre une couleur en arrière plan, modifier tout d'abord le début de la ligne de code, transformez le background-image : url('') ; #000001 en background-color : #000001. Modifier ensuite votre couleur en indiquant son code après le signe #

  • Pour changer la couleur et l'épaisseur de la bordure, modifier le code : border : solid 0px #000001, "px" signifie pixels, mettez donc le nombre de pixels voulu juste devant celui-ci, comme ceci : 5px. Pour changer la couleur, le principe reste le même, indiquer le code de la couleur après le signe #

  • Pour modifier les angles de votre fiche vous allez devoir modifier les données de ce code : border-radius : 0% 0% 0% 0%. Chaque pourcentage représente l'arrondi d'un angle, 0% est un angle droit. Le premier pourcentage représente l'angle en haut à gauche et le second en celui en haut à droite, le troisième étant l'angle en bas à gauche, le dernier est donc celui en bas à droite. Modifier le pourcentage de votre angle pour en modifier l'arrondi.

  • Pour modifier la largeur et la hauteur, modifier ces codes : width : 0px ; height : 0px. "Width" signifie largeur et "height" hauteur, changer le nombre précédant le "px" pour avoir le nombre de pixels voulu.

  • Pour le texte contenu dans la fiche utilisez la fin de la ligne de code : text-shadow: 0px 0px #000001 ; padding-left : 0px ; padding-right : 0px ; text-align : center ; padding-top : 0px. Le code text-shadow: 0px 0px permet de mettre une ombre au texte, le premier "px" dirige l'ombre vers la droite tandis que le second la dirige vers le bas, à vous de bien régler ces paramètres sachant que vous pouvez également changer la couleur de l'ombre grace au signe #. Les trois codes padding-... permettent de modifier la position du texte, left vers la droite, right vers la gauche et top vers le bas. Le code text-align permet de géré la mise en page du texte, vous pouvez mettre le texte, soit centré avec le code center, soit justifié avec justify, soit à droite avec left ou bien encore à gauche avec right.


Maintenat que vous savez faire une fiche je vais appronfondir un petit peu les textes. Pour placer un texte dans une fiche placez cette ligne de code :
Code:
<font size=0 ; face=? ; color=?></font>
Il faut placez cette ligne de code juste avant le
Code:
</div>

Après le size= indiquez la taille de police souhaité.
Après le face= indiquez la police d'écriture souhaité
Après le color= indiquez la couleur de police souhaité comme ceci : color=black ou comme ceci : color=#000001

J'espère que vous avez tout compris, si ce n'est pas le cas demandez moi.

Salut,
Spartan D-129

_________________
Toute l'histoire de mon spartan dans l'ordre.
Spoiler:
avatar
Spartan D-129
Spartan, Lieutenant

Sexe : Masculin Age : 21
Localisation : Harvest
Armes : M392 DMR / M319 IGL

Feuille de personnage
Niveau du personnage:
75/75  (75/75)
Expérience:
200/200  (200/200)

Voir le profil de l'utilisateur http://team-aure.forumgratuit.org/

Revenir en haut Aller en bas

Re: Coder une fiche

Message par Vill 'Vakam le Sam 25 Mai - 15:39

L'idée est bien, mais pour lire, ça défonce les yeux.
Je te conseille une autre image, ou une autre couleur de police.

_________________


"Les Prophètes vous mentent, et vous les suivez dans leur folie !"
avatar
Vill 'Vakam
Sangheili Ultra hérétique

Sexe : Masculin Age : 21 ans
Localisation : Cassini, près de mon transporteur d'assaut.
Armes : Double Fusil Plasma - Dague à énergie

Feuille de personnage
Niveau du personnage:
75/75  (75/75)
Expérience:
200/200  (200/200)

Voir le profil de l'utilisateur

Revenir en haut Aller en bas

Re: Coder une fiche

Message par Spartan D-129 le Sam 25 Mai - 17:15

Tu parle pour le RP de Lucille ou de tous les textes en rouges sur ce sujet ??


_________________
Toute l'histoire de mon spartan dans l'ordre.
Spoiler:
avatar
Spartan D-129
Spartan, Lieutenant

Sexe : Masculin Age : 21
Localisation : Harvest
Armes : M392 DMR / M319 IGL

Feuille de personnage
Niveau du personnage:
75/75  (75/75)
Expérience:
200/200  (200/200)

Voir le profil de l'utilisateur http://team-aure.forumgratuit.org/

Revenir en haut Aller en bas

Re: Coder une fiche

Message par Vill 'Vakam le Sam 25 Mai - 19:08

Je te parle du RP.

_________________


"Les Prophètes vous mentent, et vous les suivez dans leur folie !"
avatar
Vill 'Vakam
Sangheili Ultra hérétique

Sexe : Masculin Age : 21 ans
Localisation : Cassini, près de mon transporteur d'assaut.
Armes : Double Fusil Plasma - Dague à énergie

Feuille de personnage
Niveau du personnage:
75/75  (75/75)
Expérience:
200/200  (200/200)

Voir le profil de l'utilisateur

Revenir en haut Aller en bas

Re: Coder une fiche

Message par Napnap le Sam 25 Mai - 20:13

Je l'ai mis en Post-It, et merci ! Wink
avatar
Napnap
Unggoy Impérial

Sexe : Masculin Localisation : Sur un cargo humain en mission
Armes : Pistolet à Plasma ; Canon à Combustible

Feuille de personnage
Niveau du personnage:
0/75  (0/75)
Expérience:
200/200  (200/200)

Voir le profil de l'utilisateur http://halofact.forumgratuit.org

Revenir en haut Aller en bas

Re: Coder une fiche

Message par Spartan D-129 le Dim 26 Mai - 6:03

Merci Nap². Vill j'ai changé le fond pour le RP et normalement c'est bon Smile

_________________
Toute l'histoire de mon spartan dans l'ordre.
Spoiler:
avatar
Spartan D-129
Spartan, Lieutenant

Sexe : Masculin Age : 21
Localisation : Harvest
Armes : M392 DMR / M319 IGL

Feuille de personnage
Niveau du personnage:
75/75  (75/75)
Expérience:
200/200  (200/200)

Voir le profil de l'utilisateur http://team-aure.forumgratuit.org/

Revenir en haut Aller en bas

Re: Coder une fiche

Message par Vill 'Vakam le Dim 26 Mai - 7:44

O.K, ça va mieux. ^^

_________________


"Les Prophètes vous mentent, et vous les suivez dans leur folie !"
avatar
Vill 'Vakam
Sangheili Ultra hérétique

Sexe : Masculin Age : 21 ans
Localisation : Cassini, près de mon transporteur d'assaut.
Armes : Double Fusil Plasma - Dague à énergie

Feuille de personnage
Niveau du personnage:
75/75  (75/75)
Expérience:
200/200  (200/200)

Voir le profil de l'utilisateur

Revenir en haut Aller en bas

Re: Coder une fiche

Message par Contenu sponsorisé


Contenu sponsorisé


Revenir en haut Aller en bas

Voir le sujet précédent Voir le sujet suivant Revenir en haut

- Sujets similaires

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