Partagez
Voir le sujet précédentAller en basVoir le sujet suivant
avatar
Akatsuki - Pion de Réserve
Messages : 101
Kiri Gakure
Âge : 27 ans
Taille/Poids : 192cm / 79kg
: Ame no Kuni
: Ame gakure no Sato
一族 : Fujasawa

● Disponibilité du joueur ● : Disponible pour un RP de fesses ! Je suis un cochon !

Fiche Ninja
Evolution de l'XP:
0/45  (0/45)
PV:
350/350  (350/350)
PC:
655/655  (655/655)
Voir le profil de l'utilisateur

Aide aux Codes (In Progress)

le Lun 11 Oct - 19:47
Aide aux Codes




Tout d'abord, ce post sera en perpetuelle évolution. Les codes ne sont pas parfait : il y à souvent plusieurs façons différentes de faire la même chose. Ce qui change, c'est le degré optimal du code. Après, il y à les codes foireux qui plantent les pages.

Règle numéro 1 (La seule pour l'instant) :
Toujours fermer vos balises !
Par exemple, si je créé un
Code:
<table><tr><td>
, il faut qu'il soit fermé par
Code:
</td></tr></table>
Chaque code contient les autres, et se forme une structure qui doit être logique. Surtout que Forum actif est basé sur des tableaux : il suffit d'oublier une balise pour que toute la page se déforme !


_________________________________________________________________
_________________________________________________________________


Les Tableaux

Les tableaux sont des carrés qui contiennent des cellules. En gros, des colonnes et des lignes.

La structure basique est la suivante :

Titre ! (Si besoin)
Ligne 1Colonne 1Colonne 2
Ligne 2Colonne 1Colonne 2


La structure codée donne ça :

Code:
<TABLE BORDER="1">
<CAPTION>Titre ! (Si besoin)</CAPTION>
<TR>
<TD>Ligne 1</TD>
<TD>Colonne 1</TD>
<TD>Colonne 2</TD>
</TR>
<TR>
<TD>Ligne 2</TD>
<TD>Colonne 1</TD>
<TD>Colonne 2</TD>
</TR>
</TABLE>
Toutefois, sur forum actif, vous verrez que votre tableau se situera plus bas que ce que vous souhaitiez. En effet, les sauts de ligne du codage (pour plus de clarté quand vous codez) sont interprétés par forumactif comme des sauts de ligne tout court ! Il faut donc les supprimer pour donner un code réduit, ou minified.

La structure codée finale donnera ça :
Code:
<TABLE BORDER="1"><CAPTION>Titre ! (Si besoin)</CAPTION><TR><TD>Ligne 1</TD><TD>Colonne 1</TD><TD>Colonne 2</TD></TR><TR><TD>Ligne 2</TD><TD>Colonne 1</TD><TD>Colonne 2</TD></TR></TABLE>


_________________________________________________________________
_________________________________________________________________


Du style !


1) Images :

Pour aligner vos images à gauche ou à droite de votre texte, il suffit de mettre le lien de votre image à la place de "lien", et de placer left ou right dans la partie align="left".

Code:
<img src="Lien" align="left">

Vous pourrez même ajouter une marge en haut et en bas grâce à vspace (vertical Space) ou une marge à droite et à gauche grace à hspace (Horizontal Space).

Cela se passe ainsi :

Code:
<img src="LIEN.jpg" align="left" vspace="10" hspace="10">


2) CSS :

Pour décorer vos textes, il suffit de mettre votre post entre deux div.

Code:
<div>VOTRE TEXTE</div>

Maintenant, on va y ajouter du CSS ! Le css permet de définir le style de votre texte.

Code:
<div style="VOTRE STYLE">VOTRE TEXTE</div>

Maintenant, il suffit de choisir les codes que vous souhaitez utiliser.

Code:
text-shadow : 2px 2px 4px #000; /* Met une ombre noire à votre texte */
background-color : #646464; /* Définit une couleur de fond, que vous devez choisir parmi toutes les couleur HEXADECIMALES (cherchez sur google) */
color : #646464; /* Définit la couleur de votre texte */

Etc...

Il y à tout un tas de textes à mettre entre les "" après style. A vous de faire des recherches ^^. Il ne faudra pas oublir le point virugle ";" après chaque style. Ce qui donnerait :

Code:
<div style="text-shadow : 2px 2px 4px #000; background-color : #646464; color : #646464;">VOTRE TEXTE</div>



Dernière édition par Metsubou le Dim 17 Oct - 2:01, édité 1 fois

_________________
Niv.3 - Membre de l'Akatsuki Remplaçant
[Vous devez être inscrit et connecté pour voir cette image]
•••••••••••••••••••••••••••••••••••••••••
[Vous devez être inscrit et connecté pour voir ce lien][Vous devez être inscrit et connecté pour voir ce lien]
•••••••••••••••••••••••••••••••••••••••••

[Vous devez être inscrit et connecté pour voir cette image]
avatar
Akatsuki - Pion de Réserve
Messages : 101
Kiri Gakure
Âge : 27 ans
Taille/Poids : 192cm / 79kg
: Ame no Kuni
: Ame gakure no Sato
一族 : Fujasawa

● Disponibilité du joueur ● : Disponible pour un RP de fesses ! Je suis un cochon !

Fiche Ninja
Evolution de l'XP:
0/45  (0/45)
PV:
350/350  (350/350)
PC:
655/655  (655/655)
Voir le profil de l'utilisateur

Re: Aide aux Codes (In Progress)

le Dim 17 Oct - 1:54
UP !

Ajout de la balise d'Images souvent demandée !
Ajout des Ombres aux textes !

_________________
Niv.3 - Membre de l'Akatsuki Remplaçant
[Vous devez être inscrit et connecté pour voir cette image]
•••••••••••••••••••••••••••••••••••••••••
[Vous devez être inscrit et connecté pour voir ce lien][Vous devez être inscrit et connecté pour voir ce lien]
•••••••••••••••••••••••••••••••••••••••••

[Vous devez être inscrit et connecté pour voir cette image]
Voir le sujet précédentRevenir en hautVoir le sujet suivant
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum