AccueilFAQRechercherMembresGroupesS'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.


    Petite fiche simplette toute en rondeur

    Partagez
    Azylis
    FémininAge : 25Messages : 113

    le Jeu 25 Avr 2013 - 3:32

    Voici un des résultat que j'arrive à faire avec ce que j'ai appris sur ce forum, personnalisez la comme bon vous semble ! (normalement, toutes les erreurs ont été corrigées... :secret: )
    Comme toutes les autres fiches, n'enlevez pas le crédit s'il vous plait, quitte à ne laisser que le lien de N.U Wink

    Merci à Scavenger pour son coup de pouce !



    Nom Prénom

    Qui suis-je ?














    Je ressemble à...

    Texte
    (on sent l'inspiration à 3h du mat' ! u_u)




    Damn, I love it !

    Texte


    Qui a dit "caractère de cochon" ?!

    Texte


    Urgh. I hate it...

    Hey, passe ta souris ici : une ptite surprise t'attend ! Et tu sais quoi ? C'est pareil partout alors fais-toi plaisir : pond des pavés !




    Trop de saut de ligne tue le saut de ligne...





    Mais si je veux voir si la fiche se déforme ou pas avec un texte long je dois bien essayé ! Sauf que dans ces moments là, on ne sait pas trop quoi raconter... Pourtant il y a tellement de choses à dire ! Mais c'est pas forcément super intéressant, il faut l'avouer. Je pourrais par exemple vous parler des mœurs de la puce d'eau d'Amazonie centrale, mais ça risque de prendre du temps... mais si vous insistez je peux hein ! Eh ? Quoi ? Vous vous... ? "En carrez l'oignon" ? Ah... Bon ben... autant arrêter de remplir inutilement cette case alors T.T J'espère juste que le test sera concluant T.T A la prochaine pour d'autres aventures !

    C'est mon dernier mot !

    Et wala, c'est fini ! :3

    © Azylis avec l'aide de Scavenger de Never-Utopia



    Pour l'image, c'est 200px de largeur maximum (sauf si vous modifiez les tailles bien sûr ^^)


    Code:
    <center>
    <style>div.CellulePPContent{height : 95px; Overflow : hidden;}div.CellulePPContent:hover{Overflow : auto;}</style>
    <div style="margin-bottom: -60px;"><div style="font-size:50px; font-family: monotype corsiva; letter-spacing:2px;  text-shadow: -2px -2px 2px black; color: #122941; position: relative; z-index: 2;">Nom Prénom</div>
    <div style="font-size:40px; font-style:italic; font-family: monotype corsiva; letter-spacing:2px; text-shadow: -2px -2px 2px black; color: #b2b7ff; position: relative; z-index: 3;">Qui suis-je ?</div>
    </div>
    <div style="width:700px; border-top: 20px solid #7c80b2; border-right: 2px solid #7c80b2; border-bottom: 20px solid #7c80b2; border-left: 2px solid #7c80b2; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; background-color: #d0d0d0; color: #5b5e81; font-size: 11px; box-shadow: 0px 0px 10px #000000; position: relative; z-index: 1;">
    <table style="width: 97%; margin-top: -180px; text-align: center;">
    <tr>
    <td width= "220px;">
    <div style="margin-bottom: -20px; font-size:18px; text-shadow: -2px -2px 2px black; color: #060e11;">Je ressemble à...</div>
    <div style="border-top: 2px solid #5b5e81; border-bottom: 2px solid #5b5e81; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; height: 100px; padding: 5%; margin-bottom: -20px;"><div class="CellulePPContent">Texte
    (on sent l'inspiration à 3h du mat' ! u_u)</div></div>
    </td>
    <td rowspan="2">
    <div style="width: 200px; margin: auto; overflow:hidden; border-radius: 10px; -moz-border-radius: 10px;-webkit-border-radius: 10px;"><img src="http://i81.servimg.com/u/f81/13/93/32/39/n_poka10.jpg" /></div>
    </td>
    <td width= "220px;">
    <div style="margin-bottom: -20px; font-size:18px; text-shadow: -2px -2px 2px black; color: #060e11;">Damn, I love it !</div>
    <div style="border-top: 2px solid #5b5e81; border-bottom: 2px solid #5b5e81; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; height: 100px; padding: 5%; margin-bottom: -20px;"><div class="CellulePPContent">Texte</div></div>
    </td>
    </tr>
    <tr>
    <td width= "220px;">
    <div style="margin-bottom: -20px; font-size:18px; text-shadow: -2px -2px 2px black; color: #060e11;">Qui a dit "caractère de cochon" ?!</div>
    <div style="border-top: 2px solid #5b5e81; border-bottom: 2px solid #5b5e81; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; height: 100px; padding: 5%; margin-bottom: -20px;"><div class="CellulePPContent">Texte</div></div>
    </td>
    <td width= "220px;">
    <div style="margin-bottom: -20px; font-size:18px; text-shadow: -2px -2px 2px black; color: #060e11;">Urgh. I hate it...</div>
    <div style="border-top: 2px solid #5b5e81; border-bottom: 2px solid #5b5e81; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; height: 100px; padding: 5%; margin-bottom: -20px;"><div class="CellulePPContent">Hey, passe ta souris ici : une ptite surprise t'attend ! Et tu sais quoi ? C'est pareil partout alors fais-toi plaisir : pond des pavés !




    Trop de saut de ligne tue le saut de ligne...</div></div>
    </td>
    </tr>
    </table>
    <div style="margin-bottom: -20px; font-size:18px; text-shadow: -2px -2px 2px black; color: #060e11;">C'est mon dernier mot !</div>
    <div style="border-top: 2px solid #5b5e81; border-bottom: 2px solid #5b5e81; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; width: 500px; padding: 10px; Overflow : auto;"><div class="CellulePPContent">Et wala, c'est fini ! :3
    </div></div>
    <div style="font-size:9px; text-align: right; padding-right: 50px">© Azylis avec l'aide de Scavenger de [url=http://www.never-utopia.com/] Never-Utopia[/url]</div></div>
    </center>

    En espérant que ça serve à certain Wink


    Dernière édition par Azylis le Jeu 25 Avr 2013 - 23:05, édité 1 fois



    Capouccino
    FémininAge : 18Messages : 165

    le Jeu 25 Avr 2013 - 22:32

    I love it !!!!! Merci beaucoup <3



    "Espérer l'inespérable c'est croire en l'impossible."
    Hope
    MasculinAge : 19Messages : 763

    le Jeu 25 Avr 2013 - 22:48

    Zéniaaaaal! mais si les textes sont longs sa déforme la fiche ?
    Azylis
    FémininAge : 25Messages : 113

    le Jeu 25 Avr 2013 - 23:07

    Merci à vous deux ! >///<

    Wellan : Il y a la scrollbar qui apparait quand on passe le curseur sur les cases (cf le "Urgh. I Hate it" : j'ai fait exprès de sauter plusieurs lignes (j'ai aussi agrandis un peu le texte car tu m'avais mis un doute XD)) donc normalement non, la fiche ne se déforme pas ^^



    Okhmhaka
    FémininAge : 31Messages : 31718

    le Ven 26 Avr 2013 - 10:47

    Pas mal du tout ! J'aime bien l'idée^^ Merci du partage !



    Azylis
    FémininAge : 25Messages : 113

    le Ven 26 Avr 2013 - 19:01

    De rien ! ^^



    Aziliz
    FémininAge : 32Messages : 214

    le Mer 18 Déc 2013 - 20:48

    Très jolie !!
    Merci.

    Je l'ai prise pour mon forum.

    J'espère qu'on avait le droit aux changements de couleurs.
    J'ai laissée les crédits. :)



    Neva
    FémininAge : 25Messages : 18542

    le Jeu 19 Déc 2013 - 14:28

    @Aziliz a écrit:Très jolie !!
    Merci.

    Je l'ai prise pour mon forum.

    J'espère qu'on avait le droit aux changements de couleurs.
    J'ai laissée les crédits. :)

    Oui, pas de problème du moment que, comme tu l'as dit, tu laisses le crédit :)



     
    Razbeline
    FémininAge : 16Messages : 23

    le Sam 21 Déc 2013 - 12:53

    Merci beaucoup !
    Chèlha
    FémininAge : 23Messages : 121

    le Ven 27 Mar 2015 - 19:19

    Merci c'est super classe !
    Linoa17
    FémininAge : 26Messages : 21

    le Lun 7 Sep 2015 - 21:29

    Merci beaucoup !




    Thanks L'Anonyme :3
    ~ If you come here... You'll find me. I promise ~





    Thanks Muscarine *u* ♥:

    Kelalin
    FémininAge : 24Messages : 1405

    le Lun 7 Sep 2015 - 23:58

    Merci beaucoup \(>o<)ノ
    MeowLowDee
    FémininAge : 25Messages : 72

    le Sam 19 Sep 2015 - 14:14

    J'aime beaucoup, merci du partage Very Happy
    Contenu sponsorisé

    Aujourd'hui à 19:06


      La date/heure actuelle est Jeu 8 Déc 2016 - 19:06