Utilisation des codes

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

Résolu Utilisation des codes

Message par Honeey L. le Mer 18 Aoû 2010 - 22:10

Bonsoir,
Voilà je suis toute nouvelle dans la création d'un forum. Je visite beaucoup de forums et je vois comment les forums sont vraiment superbes. La plupart de ses forums utilisent les codes HTLM etc. Moi je n'y connais absolument RIEN Embarassed Embarassed
Si quelqu'un aurait quelques astuces de codes à me donner ce serait gentil voir si ce n'est pas trop demandé de m'aider à finir mon forum parce que je suis vraiment dépasser avec tout ça Embarassed aidez moi

Merci d'avance.


Dernière édition par Honeey L. le Dim 29 Aoû 2010 - 19:37, édité 1 fois

Honeey L.
**

Féminin
Messages : 53
Inscrit(e) le : 18/08/2010

http://you-know-you-love-me.forumactif.org/
Honeey L. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Utilisation des codes

Message par Lixyr le Mer 18 Aoû 2010 - 22:36

Tu as plein de site pour ça. Il te suffit de chercher sur internet. Le plus connu étant : Le Site du Zéro

Mais tu as également des guides : Le Guide du Langage HTML

Mais pour la suite, ce serait plus simple si tu demandais tes codes directement.

Lixyr
Aidactive
Aidactive

Féminin
Messages : 5646
Inscrit(e) le : 22/07/2010

http://forum-test-in-lixyr.rpg-dynasty.com/
Lixyr a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Utilisation des codes

Message par Honeey L. le Ven 20 Aoû 2010 - 16:58

L'une des choses que je voudrais par exemple est de mettre mon texte sur fond de couleur comme ici par exemple
vampire city
J'adore ce genre de mise en page mais je ne sais pas du tout comment faire.

PS: Merci pour tes deux sites, ils m'aident bien =D

Honeey L.
**

Féminin
Messages : 53
Inscrit(e) le : 18/08/2010

http://you-know-you-love-me.forumactif.org/
Honeey L. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Utilisation des codes

Message par ge80 le Ven 20 Aoû 2010 - 17:24

Bonjour
Voici un squelette illustrant la mise en forum
Code:
                                <div style="border: 3px solid rgb(8, 7, 7); background-color: CornFlowerBlue;" justify="">
                                <blockquote>
                                  <div align="justify"><br />
                                  <font style="font-size: 35pt; font-family: georgia; text-shadow: rgb(0, 0, 0) 1px 1px 1px; letter-spacing: -3px;"><font  color="Black">TITRE</font></font><br />
                                  <br />
                                  <br />
                                  <ul>
Le texte.
                                    <br />
                                    <br />
                                  </ul>
                                  </div>
                                </blockquote>
                                </div>

Il suffit d'insérer ce code dans une cellule d'un tableau ou alors de fixer sa dimension.

Disponible pour plus d'infos Wink
Cordialement
Ge

ge80
+ Hyperactif +

Masculin
Messages : 16159
Inscrit(e) le : 08/10/2006

http://tsi80.pro-forums.fr/
ge80 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Utilisation des codes

Message par Honeey L. le Ven 20 Aoû 2010 - 17:27

Merci, j'aime bien aussi ce code ;D

Honeey L.
**

Féminin
Messages : 53
Inscrit(e) le : 18/08/2010

http://you-know-you-love-me.forumactif.org/
Honeey L. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Utilisation des codes

Message par ge80 le Ven 20 Aoû 2010 - 17:30

Pour le titre
Code:
<div style="background-color: rgb(55, 93, 129); text-align: center;"><font face="georgia" size="7"><font color="Black">TITRE </font></font></div>

Il suffit de coller cela dans un message et vous aurez le rendu visuel.
Reste à compléter et à comprendre.

Disponible pour plus Wink
Ge


ge80
+ Hyperactif +

Masculin
Messages : 16159
Inscrit(e) le : 08/10/2006

http://tsi80.pro-forums.fr/
ge80 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Utilisation des codes

Message par Honeey L. le Ven 20 Aoû 2010 - 17:47

C'est le code que je cherchais en plus !
Merci beaucoup !
Je vais vous embêter encore un peu désolée d'avance mais comment fait on pour avoir un fond comme ceci :
varda protect
C'est le petit cadre ou il a l'icône qui m'intéresse

Honeey L.
**

Féminin
Messages : 53
Inscrit(e) le : 18/08/2010

http://you-know-you-love-me.forumactif.org/
Honeey L. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Utilisation des codes

Message par Lixyr le Lun 23 Aoû 2010 - 1:09

Quel petit cadre ?

Lixyr
Aidactive
Aidactive

Féminin
Messages : 5646
Inscrit(e) le : 22/07/2010

http://forum-test-in-lixyr.rpg-dynasty.com/
Lixyr a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Utilisation des codes

Message par ge80 le Lun 23 Aoû 2010 - 6:13

Bonjour
J'ai la même question que Lixyr Yrna.

Cordialement
Ge

ge80
+ Hyperactif +

Masculin
Messages : 16159
Inscrit(e) le : 08/10/2006

http://tsi80.pro-forums.fr/
ge80 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Utilisation des codes

Message par Honeey L. le Jeu 26 Aoû 2010 - 20:21

Désolée du temps de réponse. Celui pour écrire l'histoire.
Et j'aurais voulu savoir aussi, comment fait on pour avoir ce "cadre"
california-high
Le "cadre" avec la barre qui défile. J'ai cherche ce code partout sans le trouver

Honeey L.
**

Féminin
Messages : 53
Inscrit(e) le : 18/08/2010

http://you-know-you-love-me.forumactif.org/
Honeey L. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Utilisation des codes

Message par ge80 le Jeu 26 Aoû 2010 - 20:31

Je pense que vous voulez dire la zone texte avec ascenseur, NON ?

ge80
+ Hyperactif +

Masculin
Messages : 16159
Inscrit(e) le : 08/10/2006

http://tsi80.pro-forums.fr/
ge80 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Utilisation des codes

Message par Honeey L. le Jeu 26 Aoû 2010 - 20:38

Oui c'est cela ! =D

Honeey L.
**

Féminin
Messages : 53
Inscrit(e) le : 18/08/2010

http://you-know-you-love-me.forumactif.org/
Honeey L. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Utilisation des codes

Message par ge80 le Jeu 26 Aoû 2010 - 20:42

Ok
C'est simple.

Un tableau contenant des cellules.
Utilisation de bords arrondis
Utilisation de la propriété overflow pour l'effet barre verticale.
Rien de bien complexe.

Je regarderai et vous donnerez des explications.
Réponse demain ou par un autre "aideur".




ge80
+ Hyperactif +

Masculin
Messages : 16159
Inscrit(e) le : 08/10/2006

http://tsi80.pro-forums.fr/
ge80 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Utilisation des codes

Message par Honeey L. le Jeu 26 Aoû 2010 - 20:43

Je n'ai pas tout compris, désolé Embarassed
Mais merci beaucoup de votre aide. J'attends votre réponse ou celle d'un autre "aideur"

Honeey L.
**

Féminin
Messages : 53
Inscrit(e) le : 18/08/2010

http://you-know-you-love-me.forumactif.org/
Honeey L. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Utilisation des codes

Message par ge80 le Jeu 26 Aoû 2010 - 20:53

Le message est constitué d'une table (tableau) avec des cases (cellules)
Dans ces cellules sont placés le texte, l'image, et le titre.

Le reste n'est qu'une histoire de style pour faire les arrondis, les couleurs...

Demain, je fais un guide qui vous servira mais aussi aux autres.
J'espère que cela sera plus compréhensible que ce message Wink

Bonne nuit.

Ge

Edit : de retour.... Wink
Cette forme vous convient-elle ?
Évidemment c'est un exemple et vous pourrez tout modifier.

image:

J'attends votre avis pour faire un guide.

ge80
+ Hyperactif +

Masculin
Messages : 16159
Inscrit(e) le : 08/10/2006

http://tsi80.pro-forums.fr/
ge80 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Utilisation des codes

Message par Honeey L. le Sam 28 Aoû 2010 - 17:19

Oui c'est parfait !=D

Honeey L.
**

Féminin
Messages : 53
Inscrit(e) le : 18/08/2010

http://you-know-you-love-me.forumactif.org/
Honeey L. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Utilisation des codes

Message par ge80 le Sam 28 Aoû 2010 - 17:37

Code:

Quelques commentaires : ne pas implanter ce code !
<!— centrage  -->
                      <center>
 <!-- Conteneur -->
                      <fieldset>
<!—legende du conteneur avec taille et fonte de caracteres-->
<legend>
<span>
<font face="Georgia"><font color="red">Légende</font></font></span>
</legend>
<span style="font-size: 10pt; line-height: 100%;">
<br>
<!— tableau avec un cellule  englobant un deuxième tableau -->
<table>
      <tbody>
            <tr>
                <td align="left">
                <center>
<!—tableau avec deux cellules  -->
                  <table style="width: 441px; height: 166px;">
                        <tbody>
                          <tr>
<!— cellule 1 pour une image  -->
                              <td>
                                <div><img src="http://tsi80.probb.fr/users/2212/78/75/05/smiles/183382.gif" /><br>
                                <br>
                                <br>
                                  </div>
                                  </td>
<!— fin cellule 1 -->
<!— cellule 2 pour le texte  -->
                                  <td>
                                    <div>
                                        <div style="margin: auto; text-align: center; width: 100%;">*<font color="red">TEXTE..... </font></div>
                                            <div align="justify">Text<br/>EEEEE<br>EEEEEE<br>EEEEE<br>EEEEEEE<br>EEEEEEEE<br><br></div>
                                    </div>
                                    </td>
<!— fin cellule 2 -->
                                  </tr>
                                </tbody>
                              </table>
<!— fin tableau avec deux cellules  -->
                              </center>
                              </td>
                            </tr>
                          </tbody>
                        </table>
<!— fin tableau englobant  -->
                        <br>
                        </span>
                    </fieldset>
<!— fin Conteneur -->
          </center>
                                <br>
                                <br>
<center>


Code à tester et commenter.
Code:

<center><fieldset style="border: 5px solid blue; width: 250px;"><legend><span style="font-size: 14px; line-height: normal;"><font face="Georgia"><font color="red">TITRE</font></font></span></legend><span style="font-size: 20pt; line-height: 100%;"><table><tbody><tr><td align="left"><center><table style="width: 441px; height: 200px;"><tbody><tr><td><div style="border: 5px solid black; padding: 5px; width: 100px; -moz-border-radius-topleft: 10px; -moz-border-radius-topright: 10px; -moz-border-radius-bottomright: 10px; -moz-border-radius-bottomleft: 10px;"><img src="http://tsi80.probb.fr/users/2212/78/75/05/smiles/183382.gif" /></div></td><td><div style="border: 5px solid black; padding: 5px; width: 280px; height: 150px; -moz-border-radius-topleft: 10px; -moz-border-radius-topright: 10px; -moz-border-radius-bottomright: 10px; -moz-border-radius-bottomleft: 10px; overflow: auto;"><div style="margin: auto; text-align: center; width: 100%;">*<font color="blue">TEXTE..... </font></div><div align="justify">Text
EEEEE
EEEEEE
EEEEE
EEEEEEE
EEEEEEEE
                                   
</div></div></td></tr></tbody></table></center></td></tr></tbody></table></span></fieldset></center>

Les explications viendront ensuite si cela vous convient

Mais il se fait tard, la suite demain Wink

Cordialement
gE

ge80
+ Hyperactif +

Masculin
Messages : 16159
Inscrit(e) le : 08/10/2006

http://tsi80.pro-forums.fr/
ge80 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Utilisation des codes

Message par Honeey L. le Sam 28 Aoû 2010 - 17:49

Oui je pense que j'aurais besoin d'explications, en tout cas merci beaucoup ! =D

Honeey L.
**

Féminin
Messages : 53
Inscrit(e) le : 18/08/2010

http://you-know-you-love-me.forumactif.org/
Honeey L. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Utilisation des codes

Message par ge80 le Sam 28 Aoû 2010 - 17:52

Aucun problème mais il est trop tard.
Essayez le code dans un message pour vérifier que la disposition vous convient bien.

A demain

Répondez si c'est ok sinon exprimez vos désirs.
Je ne parle pas des détails mais de l'allure générale.

ge80
+ Hyperactif +

Masculin
Messages : 16159
Inscrit(e) le : 08/10/2006

http://tsi80.pro-forums.fr/
ge80 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Utilisation des codes

Message par Honeey L. le Sam 28 Aoû 2010 - 17:54

Je viens d'essayer le code est oui c'est bien ce que je voulais et ça me plaît bien. Merci beaucoup =D

Honeey L.
**

Féminin
Messages : 53
Inscrit(e) le : 18/08/2010

http://you-know-you-love-me.forumactif.org/
Honeey L. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Utilisation des codes

Message par ge80 le Dim 29 Aoû 2010 - 11:36

Retour sur la mise en page

Explications
Code:
<!—centrage global -->
  <center>
 <!-- Conteneur -->
 <fieldset  style="border: 5px solid black;
          width: 470px;">
<!—légende du conteneur avec taille et fonte de caractères-->
<legend>
<span style="font-size: 20px;
    line-height: normal;">
<font face="Georgia"><font color="red">TITRE</font></font></span>
</legend>

 Un texte dans le conteneur <br/>
                    </fieldset>
<!—fin Conteneur -->
</center>

Code:

 <center> <fieldset  style="border: 5px solid black; width: 470px;"><legend><span style="font-size: 20px;  line-height: normal;"><font face="Georgia"><font color="red">TITRE</font></font></span></legend>
 Un texte dans le conteneur <br/></fieldset> </center>
Ressources
Lien 1 (FR)
lien 2 (EN)

Dans ce conteneur, nous plaçons le tableau avec dans une cellule l'image et dans l'autre le texte.
Ceci remplacera le code
Code:

 Un texte dans le conteneur <br/>

On observe :
Spoiler:

Construisons l'intérieur de ce conteneur.

Aide sur les tableaux en HTML Tableau en HTML

Code:
<span style="font-size: 10pt; line-height: 100%;">
<!—tableau avec un cellule  englobant un deuxième tableau -->
<table>
      <tbody>
            <tr>
                <td align="left">
                <center>
<!—tableau avec deux cellules  -->
                  <table style="width: 441px; height: 166px;">
                        <tbody>
                          <tr>
<!— cellule 1 pour une image  -->
                              <td>
                                    <div style="border: 5px
                                                        solid black;
                                                        padding: 5px;
                                                        width: 100px;
                                                        -moz-border-radius-topleft: 10px;
                                                        -moz-border-radius-topright: 10px;
                                                        -moz-border-radius-bottomright: 10px;
                                                        -moz-border-radius-bottomleft: 10px;">{lien de la photo avec balise img}
                                  </div>
                                  </td>
<!— fin cellule 1 -->
<!— cellule 2 pour le texte  -->
                                  <td>
                                      <div style="border: 5px solid blue;
                                                        padding: 5px;
                                                        width: XXpx;
                                                        height: YYpx;
                                                        -moz-border-radius-topleft: AApx;
                                                        -moz-border-radius-topright: AApx;
                                                        -moz-border-radius-bottomright: AApx;
                                                        -moz-border-radius-bottomleft: AApx;
                                                        overflow: auto;" >
                                        <div style="margin: auto; text-align: center; width: 100%;">*
                                            <font color="red">TEXTE..... </font></div>
                                        <div align="justify">Text
EEEEE
EEEEEE
EEEEE
EEEEEEE
EEEEEEEE
</div>
                                      </div>
                                    </td>
<!— fin cellule 2 -->
                                  </tr>
                                </tbody>
                              </table>
<!— fin tableau avec deux cellules  -->
                              </center>
                              </td>
                            </tr>
                          </tbody>
                        </table>
<!— fin tableau englobant  -->                   
                        </span>

Ce qui donne avec quelques valeurs adaptées aux images et avec bordures pour visualiser les zones...
Code:
<span style="font-size: 10pt; line-height: 100%;"><table border="3" style="width: 500px;"> <tbody> <tr> <td align="left"> <br/><center><table border="6" style="width: 100%; height: 200px;"> <tbody> <tr><td style="width: 200px;">  <div style="border: 5px  solid black;  padding: 5px;  -moz-border-radius-topleft: 10px;  -moz-border-radius-topright: 10px;  -moz-border-radius-bottomright: 10px;  -moz-border-radius-bottomleft: 10px;"><img src="http://www.google.fr/intl/en_com/images/srpr/logo1w.png" />

  </div>  </td><td><div style="border: 5px solid blue; padding: 5px; width: 300px; height: 200px; -moz-border-radius-topleft: 10px; -moz-border-radius-topright: 10px; -moz-border-radius-bottomright: 10px; -moz-border-radius-bottomleft: 10px; overflow: auto;" >  <div style="margin: auto; text-align: center; width: 100%;">*<font color="red">TEXTE..... </font></div>  <div align="justify">Text et images
<img src="http://www.gstatic.com/news/img/logo/fr_fr/news.gif" />
EEEEE
EEEEEE
EEEEE
EEEEEEE
EEEEEEEE
EEEEEEE
EEEEE
EEEEEE
EEEEE
<img src="http://maps.google.fr/intl/fr_fr/images/logos/maps_logo.gif" />
</div>  </div>  </td>  </tr> </tbody> </table>  </center> </td> </tr> </tbody> </table> 
 </span>

On observe :
Spoiler:

Tout ceci étant dans le conteneur précédent...

N'hésiter à faire préciser certains points obscurs.

Cordialement
Ge

ge80
+ Hyperactif +

Masculin
Messages : 16159
Inscrit(e) le : 08/10/2006

http://tsi80.pro-forums.fr/
ge80 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Utilisation des codes

Message par Honeey L. le Dim 29 Aoû 2010 - 19:36

Je pense avoir tout saisi. En tout cas merci beaucoup pour votre aide !

Honeey L.
**

Féminin
Messages : 53
Inscrit(e) le : 18/08/2010

http://you-know-you-love-me.forumactif.org/
Honeey L. a été remercié(e) par l'auteur de ce sujet.

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


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