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.

-23%
Le deal à ne pas rater :
(Black Friday) Apple watch Apple SE GPS 44mm (plusieurs coloris) à ...
199 € 259 €
Voir le deal

    Bulle BD pour message (simple)

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

    Dim 29 Mar 2015 - 20:31

    Rappel du premier message :

    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
    Chocolakato
    Chocolakato
    FémininAge : 34Messages : 837

    Dim 15 Mai 2016 - 16:39

    Tiens c'est amusant ça !



    Dragonia
    Dragonia
    FémininAge : 35Messages : 24

    Mar 7 Juin 2016 - 17:32

    Merci ^^
    tininam
    tininam
    MasculinAge : 56Messages : 7

    Dim 12 Juin 2016 - 15:24

    Merci.
    Popcorn
    Popcorn
    MasculinAge : 34Messages : 41

    Lun 13 Juin 2016 - 19:07

    Merci beaucoup !! Hâte de voir ce que ça donne !
    Kâ Lys
    Kâ Lys
    MasculinAge : 32Messages : 299

    Jeu 14 Juil 2016 - 17:01

    merci



    Bulle BD pour message (simple) - Page 5 Bug
    Helvelina
    Helvelina
    FémininAge : 33Messages : 83

    Dim 7 Aoû 2016 - 15:59

    merci
    orion.
    orion.
    FémininAge : 28Messages : 107

    Lun 29 Aoû 2016 - 3:06

    Merci ! :)
    charly45700
    charly45700
    MasculinAge : 28Messages : 31

    Sam 3 Sep 2016 - 15:38

    merci
    Delena
    Delena
    FémininAge : 41Messages : 100

    Sam 3 Sep 2016 - 22:12

    Merci !



    Bulle BD pour message (simple) - Page 5 8s6x
    msfeettoes
    msfeettoes
    MasculinAge : 44Messages : 46

    Dim 4 Sep 2016 - 8:29

    cool merci!
    avatar
    fascicularia
    MasculinAge : 56Messages : 189

    Ven 16 Sep 2016 - 20:52

    Merci pour ce partage
    avatar
    fascicularia
    MasculinAge : 56Messages : 189

    Ven 16 Sep 2016 - 21:00

    vu que l'on ne peut éditer , une petite question :
    Quel est l'intérêt du width:601px; qui fixe une taille à la fenêtre qui peut déjà avoir une taille définie ?
    Laya
    Laya
    FémininAge : 25Messages : 19

    Sam 17 Sep 2016 - 1:53

    meurci :3
    luna-chan86
    luna-chan86
    FémininAge : 35Messages : 201

    Jeu 13 Oct 2016 - 0:53

    Merci °°



    Sparryx
    Sparryx
    MasculinAge : 22Messages : 71

    Jeu 27 Oct 2016 - 19:08

    Merci
    Voyageur-B21E3
    Voyageur-B21E3
    MasculinAge : 30Messages : 35

    Sam 5 Nov 2016 - 17:03

    Merci bien !
    Dariel
    Dariel
    FémininAge : 54Messages : 69

    Mar 22 Nov 2016 - 7:07

    Merci pour le partage Elektra

    :cow:



    C'est la vie Invité ! Pas le paradis.
    duckette59
    duckette59
    FémininAge : 36Messages : 3

    Ven 25 Nov 2016 - 22:47

    merci!
    chess
    chess
    FémininAge : 39Messages : 37

    Ven 2 Déc 2016 - 23:19

    Wouah super c'est exactement ce que je recherche !! Merci beaucoup pour ce code >w< ♥
    MPGuenette
    MPGuenette
    FémininAge : 29Messages : 111

    Sam 10 Déc 2016 - 4:19

    merci ^^
    Nyotengu
    Nyotengu
    FémininAge : 30Messages : 85

    Mer 14 Déc 2016 - 22:52

    cool
    Merkantia
    Merkantia
    FémininAge : 29Messages : 14

    Mar 20 Déc 2016 - 12:02

    Saloute et merci.
    ju621
    ju621
    MasculinAge : 41Messages : 6

    Lun 26 Déc 2016 - 12:49

    merci
    Mistiny
    Mistiny
    FémininAge : 21Messages : 23

    Dim 22 Jan 2017 - 17:38

    Merci !
    Giovale
    Giovale
    MasculinAge : 33Messages : 16

    Mar 31 Jan 2017 - 21:14

    Merci !
    Contenu sponsorisé


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