AccueilDernières imagesRechercherS'enregistrerConnexion

Forum de graphisme, codage et game design proposant des tutoriels, astuces, libres services et commandes dans les domaines de l'infographie amateur, de l'intégration web (HTML et CSS essentiellement) ainsi que dans la conception de RPG sur forum.


    Fiche de Pub Taupe

    A-Lice
    A-Lice
    FémininAge : 30Messages : 4939

    Dim 15 Mar 2015 - 20:22

    Rappel du premier message :




    Fiche de Pub Taupe


    Suite à une demande de Moys voici une fiche de Pub avec transition pour les images du staff.

    Je précise que l'arrière plan blanc correspond à mon forum.

    HTML ~ Voici donc un aperçu : www


    Et le code :
    HTML :
    Code:
    <!DOCTYPE><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <style>div.staff {width: 100px; height: 75px; margin: auto; overflow: hidden; display: inline-block; margin-left: 5px;} .staff img {position: relative; bottom: 75px; transition: all 0.5s; width: 100px; height: 75px;} .staff:hover img {bottom: 200px; transition: all 0.5s;} .txt_staff {color: #9c887d; font-size: 14px; text-align: justify; overflow: auto; width: 80px; height: 55px; padding: 10px;}</style></head><body>
    <div style="width: 530px; padding: 10px; margin: auto; background: #F5F5F2;">
      <img src="http://img15.hostingpics.net/pics/661225image791.jpg" style="width: 530px; height: 350px;" />
      <br /><br />
      <a href="Lien du forum" style="display: block; font-size: 35px; color: #9c887d; text-align: center;">Nom du forum</a>
      <br />
      <div style="width: 255px; display: inline-block; margin-right: 15px; background: #9c887d; height: 16px; color: #F5F5F2; font-size: 25px; text-align: center;">
        <span style="position: relative; top: -6px;">Contexte</span>
      </div>
      <div style="width: 255px; display: inline-block; background: #9c887d; color: #F5F5F2; height: 16px; font-size: 25px; text-align: center;">
        <span style="position: relative; top: -6px;">Informations</span>
      </div>
      <br />
      <div style="width: 215px; height: 140px; overflow: auto; display: inline-block; padding-left: 20px; padding-right: 20px; color: #9c887d; font-size: 11px; text-align: justify; margin-right: 15px;">
        Texte texte
      </div>
      <div style="width: 215px; height: 140px; overflow: auto; display: inline-block; padding-left: 20px; padding-right: 20px; color: #9c887d; font-size: 11px; text-align: justify;">
        Texte texte <br />x membres connectés
      </div>
      <br />
      <div style="width: 255px; display: inline-block; margin-right: 15px; background: #9c887d; color: #F5F5F2; height: 16px; font-size: 25px; text-align: center;">
        <span style="position: relative; top: -6px;">Nouveautés</span>
      </div>
      <div style="width: 255px; display: inline-block; background: #9c887d; color: #F5F5F2; font-size: 25px; height: 16px; text-align: center;">
        <span style="position: relative; top: -6px;">Staff</span>
      </div>
      <br />
      <div style="width: 215px; height: 80px; overflow: auto; display: inline-block; padding-left: 20px; padding-right: 20px; color: #9c887d; font-size: 11px; text-align: justify; margin-right: 15px;">
        Texte texte
      </div>
      <div style="width: 215px; height: 80px; overflow: auto; display: inline-block; padding-left: 20px; padding-right: 20px; color: #9c887d; font-size: 11px; text-align: justify;">
        <div class="staff"><div class="txt_staff">Texte ici
          </div><img src="http://img15.hostingpics.net/pics/219236image990.jpg" alt="staff" /></div>
        <div class="staff"><div class="txt_staff">Texte ici
          </div><img src="http://img15.hostingpics.net/pics/219236image990.jpg" alt="staff" /></div>
      </div>
      <br />
      <div style="background: #9c887d; color: #F5F5F2; font-size: 25px; height: 16px; text-align: center;">
        <span style="position: relative; top: -6px;">Nous lier</span>
      </div>
      <div style="color: #9c887d; font-size: 11px; text-align: justify; height: 80px; overflow: auto; padding: 15px;">
        Texte texte texte
      </div>
    <a href="http://www.never-utopia.com" style="display: block; text-decoration: none; font-size: 11px; text-align: center; color: #9c887d;">A-Lice | Never-Utopia</a>
    </div></body></html>

    Le code est à mettre dans le panneau d'administration, dans Module -> HTML & JAVASCRIPT -> Gestion des pages HTML -> Création en mode avancé (HTML)


    Et l'iframe pour poster :
    Code:
    <center><iframe src="Lien de la page HTML" border="0" frameborder="0" scrolling="no" style="margin: 10px;" width="570px" height="900px"></iframe></center>
    Si vous venez à agrandir la taille de la fiche, pensez à le faire pour l'iframe aussi !


    /!\ En cas de problème, c'est ici ou que ça ce passe.

    Shuna
    Shuna
    FémininAge : 30Messages : 137

    Ven 11 Déc 2015 - 15:09

    j'adore merci beaucoup **
    Pollux
    Pollux
    FémininAge : 34Messages : 99

    Lun 14 Déc 2015 - 12:27

    merci
    Saya Akimoto
    Saya Akimoto
    FémininAge : 38Messages : 130

    Lun 14 Déc 2015 - 13:08

    Je trouve qu'il est magnifique. Merci beaucoup. On le prends.



    Fiche de Pub Taupe - Page 3 Signat11
    Sweet Angel
    Sweet Angel
    FémininAge : 41Messages : 153

    Mer 23 Déc 2015 - 8:48

    J'aime bcp, merci
    £ternal_$unshine
    £ternal_$unshine
    FémininAge : 31Messages : 69

    Mer 23 Déc 2015 - 21:16

    Merci pour cette fiche :)



    Ce Joli Kit a été créé par ma coupine Soihra ♥
    Fiche de Pub Taupe - Page 3 78216279872221
    Camomille
    Camomille
    FémininAge : 20Messages : 62

    Sam 26 Déc 2015 - 16:09

    C'est vraiment super !
    bubulle
    bubulle
    FémininAge : 37Messages : 76

    Dim 27 Déc 2015 - 13:02

    merci
    Pikabouh
    Pikabouh
    FémininAge : 23Messages : 123

    Mer 30 Déc 2015 - 15:35

    Thanks ♥
    Sighild
    Sighild
    FémininAge : 37Messages : 225

    Dim 3 Jan 2016 - 13:56

    simple et efficace! merci!
    avatar
    Nal Souclade
    MasculinAge : 25Messages : 167

    Jeu 7 Jan 2016 - 17:56

    J'aime beaucoup ! Merci ! c:
    Mystigri
    Mystigri
    FémininAge : 21Messages : 97

    Dim 10 Jan 2016 - 15:11

    Pas mal !



    double-face
    double-face
    FémininAge : 34Messages : 18

    Dim 10 Jan 2016 - 22:19

    merci !
    Max Rénix
    Max Rénix
    MasculinAge : 29Messages : 56

    Jeu 21 Jan 2016 - 0:34

    merci beaucoup :)
    Nihal
    Nihal
    FémininAge : 20Messages : 23

    Sam 30 Jan 2016 - 19:04

    Merci!
    Kâ Lys
    Kâ Lys
    MasculinAge : 32Messages : 299

    Dim 21 Fév 2016 - 0:47

    Merci



    Fiche de Pub Taupe - Page 3 Bug
    Voltino
    Voltino
    MasculinAge : 30Messages : 55

    Lun 22 Fév 2016 - 11:55

    Merci !
    Enid.
    Enid.
    FémininAge : 31Messages : 23

    Lun 22 Fév 2016 - 18:25

    Simple et jolie, merci :)
    Kilda
    Kilda
    FémininAge : 44Messages : 73

    Lun 22 Fév 2016 - 18:29

    merci
    Dorin
    Dorin
    FémininAge : 49Messages : 33

    Sam 27 Fév 2016 - 9:09

    merci
    RainboWolf
    RainboWolf
    FémininAge : 27Messages : 102

    Jeu 3 Mar 2016 - 14:07

    Simple mais efficace, merci !
    Amacky
    Amacky
    FémininAge : 32Messages : 135

    Lun 7 Mar 2016 - 14:58

    Merci :)
    Likilou
    Likilou
    MasculinAge : 31Messages : 309

    Dim 13 Mar 2016 - 16:03

    Merci



    Fiche de Pub Taupe - Page 3 707828SignArthur2
    Raela
    Raela
    FémininAge : 29Messages : 45

    Dim 13 Mar 2016 - 18:30

    Merci beaucoup pour le partage ! :hug:
    Mr. Shidokaz
    Mr. Shidokaz
    MasculinAge : 30Messages : 192

    Sam 19 Mar 2016 - 12:53

    Merci beaucoup pour le partage ! Wink
    blomkvist
    blomkvist
    FémininAge : 33Messages : 44

    Mer 23 Mar 2016 - 15:25

    elle estmagnifique, merci du partage ça permet de comprendre :heart:



    ☆ once upon a dream ☆
    I know you, I walked with you once upon a dream. I know you, that look in your eyes is so familiar a gleam. And I know it's true that visions are seldom all they seem. But if I know you, I know what you'll do. You'll love me at once, the way you did once upon a dream. ~ byendlesslove.
    Contenu sponsorisé


      La date/heure actuelle est Jeu 21 Nov 2024 - 12:11