• Encadrer un code

    Voici le tuto pour encadrer un code, exemple d'encadré:

     

    Commençons par le css!

    .boite {
    width: LARGEUR DES ENCADRÉpx;
    border: 1px double black;
    color: COULEUR DE L'ÉCRITURE;
    background-color: FOND DE L'ENCADRÉ;
    font-family: POLICE DE CARACTÈRE;
    font-size: TAILLE DE LA POLICEpx;
    }

    Une fois ce code rentré et sauvegardé, il suffit de mettre l'html:

    <div class="boite">VOTRE CODE</div>

    Deux remarques: Quand vous éditer votre article/rubrique/page etc..., l'encadré n’apparaît pas, c'est normal, mais il apparaîtra dans l'article/rubrique/page etc... une fois enregistré. Sinon, il se peut que quand vous vouliez mettre un code dans un encadré, il affiche directement le résultat, dans ces cas-là, vous copiez le code à encadré, et à la place, vous mettez n'importe quoi, par exemple: Salut!, ensuite, dans l'éditeur normal, vous sélectionnez le "Salut!" et vous le remplacez par votre code en faisant collez.


    Tags Tags : , , , ,
  • Commentaires

    1
    Dimanche 29 Juillet 2012 à 10:52

    comment ta fait le fond blanc ? voici mon code : .boite {
     width:500px;
    border: 1px double black;
    color: #white;
    background-color: #white;
    font-family: gabriola;
    font-size: 15px;
    }

      

    je trouve pas ^^'

    2
    Dimanche 29 Juillet 2012 à 12:27

    déjà, après "color", met black, parce que, sinon, ça écriras en blanc sur un fond bland: en clair, on verra rien, sinon, pour le fond, enlève le #, pour faire clair, tu met ce code:

    .boite {
     width:500px;
    border1px double black;
    colorblack;
    background-colorwhite;
    font-familygabriola;
    font-size15px;
    }

    Si tu veux mon code, le voici:

    .boitewidth400px
               border1px double black
               colorblack
               background-colorwhite;
    font-familyCourier New;
    text-shadownone;
    font-size13px;
        font-weightnormal;}

    3
    Dimanche 29 Juillet 2012 à 12:30

    sinon, je te conseille de refaire les fenêtres, ça parait compliqué mais c'est très simple, regarde l'annonce ou clique tout simplement ICI

    Après, tu fais ce que tu veux ^^

    4
    Dimanche 29 Juillet 2012 à 22:07

    ah merci ca marche c'est bon ! merci ^^

     

    5
    Lundi 5 Novembre 2012 à 13:48

    Merci pour le code ,  c'est très utile car , comme ça on peut savoir ou se trouve le code =)



    Ajouter un commentaire

    Nom / Pseudo :

    E-mail (facultatif) :

    Site Web (facultatif) :

    Commentaire :