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.

Le Deal du moment : -28%
-28% Machine à café avec broyeur ...
Voir le deal
229.99 €

    Bulle BD pour message (simple)

    Elektra Kloo
    Elektra Kloo
    FémininAge : 35Messages : 156

    Dim 29 Mar 2015 - 20:31

    Bulle BD

    Aperçu

    I - CSS
    Code:

    #bulle {
        position: relative;
        color : #000000;
    background: #ffffff;/** couleur du fond (se retrouve 2 fois) **/
        font-size:16px;
    border: 5px solid #FFFFFF; /** taille de la bordure et couleur (se retrouve 2 fois) **/
    width:601px;
        min-height:100px;} /** dimensions de la cellule (du cadre) **/
    #bulle:after, #bulle:before {right: 100%; /** right pour mettre la flèche à gauche ! **/
    border: solid transparent; content: ""; position: absolute;}
    #bulle:after {border-right-color: #ffffff; /** 2e indication de couleur du fond **/
    border-width: 33px; /** grandeur de la flèche **/
    top: 50%; /** position de la flèche (se retrouve 2 fois) **/
    margin-top: -33px;} /** indication de la grandeur de la flèche (valeur négative) **/
    #bulle:before {border-right-color: #FFFFFF; /** 2e indication de la couleur de la bordure **/
    border-width: 40px; /** indication de la grandeur de la flèche +7px **/
    top: 50%; /** 2e indication de la position de la flèche **/
    margin-top: -40px; } /** indication de la grandeur de la flèche +7px (valeur négative) **/

    2 - Templates
    Rendez vous dans Affichage > Templates > Général > Viewtopic_body
    Repérer ceci
    Code:
    <div>{postrow.displayed.MESSAGE}</div>

    Mettez devant
    Code:
    <div id="bulle">

    Mettez derrière la balise "...MESSAGE}"
    Code:
    </div>

    Style tchat pour contenue rp

    Aperçu

    1 - Code pour vos messages

    Code:
    <img style="width: 62px; height: 62px;" src="URLICONSINTERLOCUTEUR" /><img style="width: 549px; height: 62px;" src="http://img15.hostingpics.net/pics/548257tchat2.png"
    <div id="bulle" style="font-family:'Aldrich'" /> blabla</div><img style="width: 4589px; height: 62px;" src="http://img15.hostingpics.net/pics/227626tchat.png" /><img style="width: 62px; height: 62px;" src="URLICONSPERSONNEL" />
    <a href="http://www.never-utopia.com/" style="font-size:11px; color:#767676; text-decoration:none;">© By ElektraKloo sur Never-Utopia</a>

    ATTENTION NE PAS COMBINER LES DEUX SINON CELA FAIT DOUBLE BULLE


    Mettre un crédit vers Never-Utopia est obligatoire. Retirer un crédit est interdit.
    Si vous avez des problèmes avec ce LS, venez poster ici.
    Merci de laisser un message pour donner vos impressions, commentaires et/ou remerciements ^^


    Dernière édition par Elektra Kloo le Mar 31 Mar 2015 - 13:03, édité 1 fois
    A-Lice
    A-Lice
    FémininAge : 30Messages : 4939

    Lun 30 Mar 2015 - 14:08

    Même remarque pour le hide !
    Sinon c'est une super idée (:

    Elektra Kloo
    Elektra Kloo
    FémininAge : 35Messages : 156

    Mar 31 Mar 2015 - 13:04

    Voila c'est fait
    A-Lice
    A-Lice
    FémininAge : 30Messages : 4939

    Mar 31 Mar 2015 - 15:04

    Merci beaucoup ! C'est nikel.

    TroisQuartsLicorne
    TroisQuartsLicorne
    FémininAge : 94Messages : 76

    Mar 14 Avr 2015 - 2:21

    Regardons ce code !
    Merci du partage ! :)



     
    The Shiya
    The Shiya
    FémininAge : 35Messages : 77

    Sam 18 Avr 2015 - 15:08

    merci



    Bulle BD pour message (simple) Test10
    Babouine
    Babouine
    FémininAge : 30Messages : 17

    Dim 19 Avr 2015 - 12:57

    Merci beaucoup Very Happy
    pimslady
    pimslady
    FémininAge : 35Messages : 71

    Ven 24 Avr 2015 - 22:27

    génial!! merci
    LaCrapul
    LaCrapul
    MasculinAge : 30Messages : 24

    Lun 27 Avr 2015 - 1:46

    Merci
    Littlelittle
    Littlelittle
    FémininAge : 39Messages : 52

    Lun 27 Avr 2015 - 15:37

    Merci ! =D



    Bulle BD pour message (simple) Tumblr_inline_mz9sdyTDtj1s2c2nz

    << A little thing like another >>
    Nezzoon
    Nezzoon
    FémininAge : 25Messages : 66

    Lun 27 Avr 2015 - 19:35

    Merci !
    Sakura-chan
    Sakura-chan
    FémininAge : 27Messages : 180

    Ven 1 Mai 2015 - 15:02

    Très sympa ! ^^
    Mimio
    Mimio
    FémininAge : 30Messages : 191

    Sam 2 Mai 2015 - 18:09

    Merci ^,,^



    Bulle BD pour message (simple) 134914Signazael2
    ptite_perle
    ptite_perle
    FémininAge : 61Messages : 128

    Dim 3 Mai 2015 - 19:48

    Trop bien; merci :)



    Bulle BD pour message (simple) Signature
    Ouat
    Ouat
    FémininAge : 40Messages : 74

    Lun 4 Mai 2015 - 9:54

    très bonne idée, merci
    MOON LEE
    MOON LEE
    FémininAge : 30Messages : 149

    Mer 6 Mai 2015 - 11:13

    Merci
    Egyfu
    Egyfu
    FémininAge : 31Messages : 56

    Mer 6 Mai 2015 - 18:45

    Il fallait y penser, bravo et merci !
    Liia
    Liia
    FémininAge : 29Messages : 91

    Ven 8 Mai 2015 - 15:05

    Merci :3
    Bellabimbo444
    Bellabimbo444
    FémininAge : 26Messages : 61

    Ven 8 Mai 2015 - 19:54

    Thank's !



    Mystick
    Mystick
    FémininAge : 39Messages : 100

    Jeu 14 Mai 2015 - 13:23

    merci pour le partage
    Monaka
    Monaka
    FémininAge : 32Messages : 137

    Dim 24 Mai 2015 - 13:39

    merci du partage ♥
    Kraft
    Kraft
    FémininAge : 26Messages : 37

    Lun 25 Mai 2015 - 17:27

    Merci ! (:
    Ilfasidrel
    Ilfasidrel
    FémininAge : 26Messages : 36

    Jeu 28 Mai 2015 - 20:37

    Merci!
    avatar
    Lupa
    FémininAge : 28Messages : 183

    Mer 3 Juin 2015 - 7:03

    Merci, c'est très sympa ! =D



    To die would be an awfully big adventure... ~ Peter Pan, James M. Berrie.
    Nearween
    Nearween
    FémininAge : 26Messages : 213

    Sam 6 Juin 2015 - 11:03

    merkii o/



    Bulle BD pour message (simple) Tumblr_static_tumblr_static_e0bc42ijrzwc84o84s4s8o0g_640

    Stand by Me
    Contenu sponsorisé


      La date/heure actuelle est Jeu 21 Nov 2024 - 9:40