Come decorare la propria Scheda

HTML per bellezza

« Older   Newer »
 
  Share  
.
  1. Bruno-
        +1   -1
     
    .

    User deleted


    CITAZIONE (dark-oblio @ 18/1/2012, 17:24) 
    Snorlax :*normale*: :*male*:

    gif
    Lv 28 Pv 94

    Mosse:

    Corposcontro (-59, 50% Par)
    Russare (-61, utilizzabile solo mentre il Pokémon è addormentato)
    Morso (-56)
    Riposo (cura status e pv, ma vai zzz)
    Exp: 65/100

    Strumento: collanaAmuleto del Potere (Consente di dare un secondo tipo al pokemon.)

    Potenziamenti: 1xPs-su


    Mi sapete fare una scheda più simile possibile a questa in bbcode? fg
     
    .
  2. Red./
        +1   -1
     
    .

    User deleted


    CITAZIONE (Shu @ 18/1/2012, 21:01) 
    a me anche è cosi, tutta tirata verso sinistra...pecche?

    E' perfettamente normale! E' proprio nel codice del "DIV" che c'è scritto di allineare verso sx (l'ho fatto proprio per evitare che avanzassero spazi inutilizzati ^^)




    CITAZIONE (Bruno- @ 18/1/2012, 21:20) 
    Mi sapete fare una scheda più simile possibile a questa in bbcode? fg

    Il bbcode è praticamente uguale a quello che c'è già in quella scheda. Soltanto che a parte per [IMG], [URL], [color], [center], [size], [font] ed il trio [code/quote/spoiler] mi pare che il circuito non supporti gli altri caratteri.

    [b]grassetto bbcode[/b] <--- visto?! xD

    Cmq, a che ti serviva? ^^
     
    .
  3. Red./
        +1   +1   -1
     
    .

    User deleted


    Schede colorate



    Dopo che Mr3 le aveva definite "da crisi epilettiche" (xD) ritornano con colori meno sgargianti, ma più "originali".
    In che senso originali?! Beh, nel senso che la tonalità è esattamente la stessa delle targhette dei tipi! Andiamo a vere i colori!!!


    Tabella Colori
    TipoColore ChiaroColore MedioColore Scuro
    :*acciaio*:#d8d8c0#b8b8d0#807870
    :*acqua*:#98d8d8#6890f0#807870
    :*buio*:#a8a878#705848#484038
    :*coleottero*:#d8e030#a8b820#789010
    :*drago*:#b8a0f8#7038f8#483890
    :*elettro*:#f8f878#f8d030#b8a038
    :*erba*:#c0f860#78c850#588040
    :*folletto*:#fad0c5#f69fb2#f9628f
    :*fuoco*:#f8d030#f05030#903028
    :*ghiaccio*:#d0f8e8#98d8d8#9090a0
    :*lotta*:#f05030#903028#484038
    :*normale*:#d8d8c0#a8a878#705848
    :*psico*:#f8c0b0#f85888#906060
    :*roccia*:#e0c068#b8a038#886830
    :*spettro*:#a890f0#705898#483850
    :*terra*:#f8f878#e0c068#886830
    :*veleno*:#d880b8#a040a0#483850
    :*volante*:#c8c0f8#a890f0#705898
     


    Questi possono essere inseriti senza alcun problema nelle tabelle precedenti per arricchirle dei colori dei vostri pkmn! Inoltre ora vi illustrerò come avere sia un colore di sfondo, che uno nel bordo assieme!
    NOTA: i colori più chiari/scuri son consigliati per i borbi. Anche perché noterete che certi son quelli principali di altre targhette, quindi se non volete un Charizard con una scheda come se fosse un Pikachu, usate i colori medi come ho fatto io!!! xD





    Fieldset + Colore



    Gligar
    png
    :*terra*: :*volante*: :*male*:
    Lvxxx Pvxxx
    Mossa_1
    Mossa_2
    Mossa_3
    Mossa_4
    Exp: 0/50
    Strumento: ///



    CODICE:
    CODICE
    <fieldset style="border:???px solid COLORE-B; background-color: COLORE-S;"><p align="center"><b>NOME PKMN</b>
    [IMG]IMMAGINE PKMN[/IMG]
    TIPO/I E SESSO
    <b>Lv</b>xxx <b>Pv</b>xxx
    Mossa_1
    Mossa_2
    Mossa_3
    Mossa_4
    <b>Exp:</b> 0/xxx
    <b>Strumento:</b> <i>///</i></p></fieldset>


    La tabella è perfettamente uguale a quella "fieldset classica" o "Cornice senza Tabella", quindi sapete già come editarla! Parliamo direttamente di come modificare il colore:

    1) Sostituite "COLORE-B" con il nome, o una delle tonalità da me fornite, per modificare il colore del bordo!
    2) Sostituite "COLORE-S" con il nome, o una delle tonalità da me fornite, per modificare il colore dello sfondo!
    3) Ricordatevi di sostituire "???" con la larghezza (in pixel) della cornice!




    Table + Colore



    pngGligar
    :*terra*: :*volante*: :*male*:
    Lvxxx Pvxxx

    Attacchi:
    Mossa_1
    Mossa_2
    Mossa_3
    Mossa_4
    Exp: 0/50 / Strumento tenuto: ///


    CODICE:
    CODICE
    <table style="border: ???px solid COLORE-B; background: COLORE-S;">

    <tr>
    <td width=96>[IMG]IMMAGINE[/IMG]</td>
    <td>[size=1]<b>NOME PKMN</b>
    TIPO/I E SESSO
    <b>Lv</b>xxx <b>Pv</b>xxx

    <b>Attacchi:</b>
    Mossa_1
    Mossa_2
    Mossa_3
    Mossa_4[/size]</td>
    </tr>

    <tr>
    <td colspan=2>[size=1]<b>Exp:</b> 0/xxx / Strumento tenuto: <b>///</b>[/size]</td>
    </tr>

    </table>


    Anche qui c'è poco da dire, è la cara vecchia "Tabella Semplice". Se non vi ricordate come si modifica la tabella controllate le istruzioni di base, altrimenti procedete subito con questi punti per impostare i colori:

    1) Sostituite "COLORE-B" con il nome, o una delle tonalità da me fornite, per modificare il colore del bordo!
    2) Sostituite "COLORE-S" con il nome, o una delle tonalità da me fornite, per modificare il colore dello sfondo!
    3) Ricordatevi di sostituire "???" con la larghezza (in pixel) della cornice!




    Per ora è tutto! Tentevi aggiornati! ;)

    Edited by Xarcom - 1/3/2017, 22:27
     
    .
  4. Red./
        +1   -1
     
    .

    User deleted


    Fieldset + Div



    Avevo già creato in passato una tabella del genere, infatti nei vecchi post si vede ancora il risultato di tale creazione. Qui ripropongo la medesima tabella solo adesso, in quanto come grado di difficoltà è più difficile sel semplice "Fieldset + Colore". Armiamoci dei nostri colori non epilettici (@ Mr3 ^^) e cominciamo la lezione!!!

    Tabella Colori
    TipoColore ChiaroColore MedioColore Scuro
    :*acciaio*:#d8d8c0#b8b8d0#807870
    :*acqua*:#98d8d8#6890f0#807870
    :*buio*:#a8a878#705848#484038
    :*coleottero*:#d8e030#a8b820#789010
    :*drago*:#b8a0f8#7038f8#483890
    :*elettro*:#f8f878#f8d030#b8a038
    :*erba*:#c0f860#78c850#588040
    :*folletto*:#fad0c5#f69fb2#f9628f
    :*fuoco*:#f8d030#f05030#903028
    :*ghiaccio*:#d0f8e8#98d8d8#9090a0
    :*lotta*:#f05030#903028#484038
    :*normale*:#d8d8c0#a8a878#705848
    :*psico*:#f8c0b0#f85888#906060
    :*roccia*:#e0c068#b8a038#886830
    :*spettro*:#a890f0#705898#483850
    :*terra*:#f8f878#e0c068#886830
    :*veleno*:#d880b8#a040a0#483850
    :*volante*:#c8c0f8#a890f0#705898
     


    NOTA: i colori più chiari/scuri son consigliati per i borbi. Anche perché noterete che certi son quelli principali di altre targhette, quindi se non volete un Charizard con una scheda come se fosse un Pikachu, usate i colori medi come ho fatto io!!!

    Gligar :*terra*: :*volante*: :*male*:
    png
    Lv xxx Pv xxx Exp: 0/50

    Mosse:

    Mossa_1
    Mossa_2
    Mossa_3
    Mossa_4
    Strumento: ///

    Potenziamenti: ///



    CODICE:
    CODICE
    <fieldset style="border: ???px solid COLORE-B; background-color: COLORE-S;"><legend>[color=black]<b>[size=3]NOME PKMN[/size]</b>[/color] TIPO/I E SESSO</legend><div style="float: left; margin-right: 10px">[IMG]IMMAGINE[/IMG]</div><div style="float: left; margin-right: 10px">[color=black][size=1]<b>Lv</b> xxx <b>Pv</b> xxx <b>Exp:</b> xxx/xxx

    <b>Mosse:</b>

    Mossa_1
    Mossa_2
    Mossa_3
    Mossa_4[/color][/size]</div><div style="float: left; margin-right: 10px">[size=1][color=black]<b>Strumento:</b> ///

    <b>Potenziamenti:</b> ///[/color][/size]</div>
    </fieldset>


    Per montarla dovrete soltanto sostituire:

    1) "IMMAGINE" con il link dell'immagine del pkmn
    2) "NOME PKMN" e "TIPO/I E SESSO" direi che sono abbastanza scontati, nel primo va il nome o soprannome (vedi le fisse di Tolo...) mentre nel secondo i tipi (Acciaio, Acqua, ecc.) ed il sesso (maschio o femmina).
    3) Mossa_1/2/3/4, che vanno sostituiti tutti e 4 con le mosse del pkmn (ovviamente se ne ha meno potete tranquillamente cancellare le scritte che non vi servono .-.)
    4) "xxx", che vanno sostituiti con i valori che servono (il Lv, i Pv e l'Exp per salire di livello).
    5) "COLORE-B" con il nome, o una delle tonalità da me fornite, per modificare il colore del bordo!
    6) "COLORE-S" con il nome, o una delle tonalità da me fornite, per modificare il colore dello sfondo!
    7) "???" con la larghezza (in pixel) della cornice!
    ATTENZIONE: noterete che ci sono dei "modificatori" di colore "[color=COLORE-T]" il cui compito è di modificare il colore del testo. Se volete il testo di un altro colore vi basterà sostituire "COLORE-T con il colore che volete (consiglio sempre topic dei colori o mio elenco). Io anche nel codice ho lasciato il nero, perchè si vede con qualunque sfondo! Vi ricordo che il colore delle scritte varia in base alla skin del forum.

    Non fatevi ingannare dal fatto che sia tutto schiacciato verso sinistra: una volta che inserirete le mosse, e l'effetto dell'oggetto (per non parlare dell'abilità) potrete ammirare il risultato! Se invece non volete che vada a capo dovrete eseguire le seguenti modifiche:

    Ulteriori modifiche:
    Noterete che nel codice c'è l'attributo:

    CODICE
    <div style="float: left; margin-right: !!!px">ALTRA PARTE DI CODICE</div>


    Serve per separare le scritte all'interno del fieldset. Per modificare la distanza l'una dall'altra vi basterà sostituire "!!!" con la distanza (in pixel) di quanto volete che la scritta, alla destra del contenuto del <div>, sia spostata!




    Volendo a questo punto potreste scatenare la vostra fantasia e creare già tabelle fuori dall'ordinario!!! Inoltre potreste mischiare Fieldset e Table per rendere ogni scheda molto ordinata e bella alla vista. Per ora non ve ne voglio parlare per non confondervi troppo le idee! ^^

    Alla prossima! Tenetevi aggiornati!
    ;)

    Edited by Xarcom - 1/3/2017, 22:34
     
    .
  5. Bruno-
        +1   -1
     
    .

    User deleted


    CITAZIONE (Red./ @ 18/1/2012, 22:30) 
    Cmq, a che ti serviva? ^^

    Per Smogon, dato che l'HTML non va e che i converter su internet fanno schifo fg

    Table + Colore è assolutamente fantastica, la userò per le prossime squadre ^^
     
    .
  6.     +1   -1
     
    .
    Avatar


    Group
    Amministratore
    Posts
    26,290
    Pokécrediti
    +42,414

    Status
    OFFLINE
    bel lavoro red ^^
    appena posso mi metto a cercare pure o di fare HTML così carini ^^
     
    .
  7.     +1   -1
     
    .
    Avatar


    Group
    Coder
    Posts
    21,702
    Pokécrediti
    +16,134

    Status
    OFFLINE
    CITAZIONE (Red./ @ 18/1/2012, 19:06) 
    CITAZIONE (rufus96 @ 18/1/2012, 16:38) 
    Non riesco ad inserire le immagine dei pokemon nelle rispettive tabelle pur copiando il codice e inserendo l'url

    Okay, mi metteresti in CODE una copia del codice che hai inserito nella tua scheda? Così individuo subito l'errore ^^

    Anche perchè mi pare assurdo che con il classico [IMG][/IMG] non si veda l'immagine del pkmn .-.

    ......


    intendevo come sfondo della tabella
     
    .
  8.     +1   -1
     
    .
    Avatar


    Group
    Amministratore
    Posts
    26,290
    Pokécrediti
    +42,414

    Status
    OFFLINE
    per quello ci pensa il grande rajan a rispondere ^^
    CITAZIONE
    ACCIAIO --------> b8b8d0
    ACQUA --------> 6890f0
    BUIO --------> 705848
    COLEOTTERO --------> a8b820
    DRAGO --------> 7038f8
    ELETTRO --------> f8d030
    ERBA --------> 78c850
    FUOCO --------> f05030
    GHIACCIO --------> 98d8d8
    LOTTA --------> 903028
    NORMALE --------> a8a878
    PSICO --------> f85888
    ROCCIA --------> b8a038
    SPETTRO --------> 705898
    TERRA --------> e0c068
    VELENO --------> a040a0
    VOLANTE --------> a890f0

    nella parte di codice
    background-color: COLORE-S;"
    al posto di COLORE-S metti uno dei codici di prima come per esempio se è volante metti a890f0 , veleno a040a0 e così via ^^
     
    .
  9. Red./
        +1   -1
     
    .

    User deleted


    Se non avessi fatto "quota" non avrei mai visto che avevi scritto il codice della tabella... Cavolo rufus, te l'ho detto: mettilo in CODE. C'è il pulsante tra QUOTE e SPOILER. ^^

    Se non metti le righe e le colonne
    certo che la tabella non ti funziona con l'immagine
    persino se il codice è giusto .-.

    perchè non aspetti che faccia il tutorial?!


    Qui Red, chiudo! O_o




    EDIT:

    Grazie per il supporto Rajan, ma lui voleva mettere delle immagini come sfondo! ;)

    Il prossimo tutorial lo farò per le immagini và, ho già capito che sennò il forum sarà pieno di schede deforme!!! xD
     
    .
  10.     +1   -1
     
    .
    Avatar


    Group
    Amministratore
    Posts
    26,290
    Pokécrediti
    +42,414

    Status
    OFFLINE
    ah ok XD
    il code è piccolissimo un rigo,nei 2 " metti il link e alla fine </table>
    red potresti mettere anche il code per unire le tabelle come per esempio le tiene shu che ha 1 pokemon a destra e 1 sinistra...ora provo a vedere se funziona anche con queste *-*
     
    .
  11.     +1   -1
     
    .
    Avatar


    Group
    Coder
    Posts
    21,702
    Pokécrediti
    +16,134

    Status
    OFFLINE
    Non sono come l'altro rufus che si ostina a mettere quei brutti colori
     
    .
  12.     +1   -1
     
    .
    Avatar


    Group
    Amministratore
    Posts
    26,290
    Pokécrediti
    +42,414

    Status
    OFFLINE
    non so perchè non vi fate 2 account diversi ._.
    ps.non si mettono affianco queste di red >.<
     
    .
  13.     +1   -1
     
    .
    Avatar


    Group
    Coder
    Posts
    21,702
    Pokécrediti
    +16,134

    Status
    OFFLINE
    Ma perchè invece non pensi al tuo di account tesoro ? :D non sono qui per litigare nè nulla, anche se ne avrei una dannata voglia. ad ogni modo. le cose si fanno ordinare e non ad AC/DC … poi fai come vuoi altro rufus… libera scelta… io personalmente credo che siano più belle in ordine con un colore...
     
    .
  14. Red./
        +1   -1
     
    .

    User deleted


    Non litigate... xD

    Ai 2 Rufus: per come decorare la vostra scheda parlatene tra di voi e poi decidete. Non venite qui a scombinare le idee agli altri o a fare un posto uno, un post l'altro come se fosse la tag! xD
     
    .
  15.     +1   -1
     
    .
    Avatar


    Group
    Coder
    Posts
    21,702
    Pokécrediti
    +16,134

    Status
    OFFLINE
    no, mi sono scordato di arrivare alla conclusione :3 ovvero che coi colori di sfondo i codici sono più facili. scusa red
     
    .
220 replies since 20/9/2010, 10:45   12858 views
  Share  
.