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.


    Fiche de réponse RP 01 (bleu, orange, transitions) ▬ Elysia

    Partagez
    Elysia
    FémininAge : 17Messages : 139

    le Mar 7 Avr 2015 - 6:17

    Hello ! Je viens donc vous proposer mon premier LS codé avec amûr comme j'aime le dire... Il s'agit donc d'une fiche de RP aux couleurs assez pétillantes, adaptée dans un contexte jovial et festif mais déconseillée pour les univers macabres, de zombies ou autres (quoique ça peut vous donner un style). M'enfin vous aurez compris l'idée.

    Langages : HTML, CSS.
    Aperçus : fiche de base | titre survolé | image survolée
    (le fond gris ne fait pas partie de la fiche RP)

    → Le code CSS est séparé du code HTML pour une raison technique : les sélecteurs CSS.

    → Le code a été compressé suite au bug de gestion des alinéas et des retours à la ligne qu'a l'éditeur de FA et qui faisait totalement planter la structure de la fiche. Cependant, je vous fourni également une version indentée du code afin que vous puissiez vous repérer et apporter les modifications que vous désirez sur le modèle compressé. Veillez à conserver la compression lorsque vous posterez cette fiche sur un forum forumactif !

    → Les images des featurings font 250*100px, par mesure de précaution, même si vous mettez une image qui ne respecte pas ces dimensions, elle sera déformée pour être à la bonne taille.

    → Vous avez la possibilité de modifier légèrement la fiche si vous vous y connaissez en codage, mais en aucun cas de retirer le copyright. Wink

    → Vous pouvez me contacter par MP en cas de problème, mais vous aurez plus de chance d'avoir une réponse plus rapide dans cette section.

    → Un petit remerciement rendra les codes visibles ! En espérant que ça vous plaise !




    Dernière édition par Elysia le Mer 8 Avr 2015 - 15:28, édité 3 fois



    A-Lice
    FémininAge : 22Messages : 4939

    le Mar 7 Avr 2015 - 11:33

    Yo !
    Tout d'abord merci pour cette proposition ! Mais je vais te demander d'y apporter quelques modifications ><

    La première concerne ton aperçu, ne mets pas le lien de ton forum. Privilégie l'affichage des images directement, je te conseille donc de les mettre les 3 l'une à la suite de l'autre (en lien comme tu as fait ça ne dérange pas).

    Ensuite, ma remarque suivante concerne les préfixes. Pour box-shadow comme pour border-radius ils sont inutiles et alourdissent le code ! De même pour les transitions, à part le webkit (pour safari) les autres ne servent à rien.

    Dans ton CSS tu devrais ajouter un espace entre la fermeture de ton crochet et le début de ce qui suit. Autre conseil, du moment que c'est du texte à l'intérieur des balises tu peux sauter des lignes normalement pas besoin d'utiliser le br xD Comme ceci :
    Code:
    <div style="font-size: 20px;">Le blabla qui est ici
    peut être agencé comme
    on le désire sans balise <br />.</div>
    Exemple :
    Le blabla qui est ici
    peut être agencé comme
    on le désire sans balise
    .


    Dernier commentaire, concernant ton crédit, c'est parfait comme tu l'as mis, mais il faudrait utiliser la balise des liens :
    Code:
    <a href=""></a>


    Après, j'apprécie les détails que tu donnes au début de ton message. Tous ne le font pas. Mais j'ai cependant une question, pourquoi utilises-tu des sélecteurs :hum: ?

    Elysia
    FémininAge : 17Messages : 139

    le Mar 7 Avr 2015 - 19:20

    Je procèderai à toutes les modifications que tu m'as demandées dans la journée de demain, en assayant d'arranger mon css comme conseillé. :)
    (Pour la non nécessité du <br />, tu as sûrement raison ! Je ne sais pas d'où je tiens ça, ce n'est pas valable que sur FA ?)

    En ce qui concerne les sélecteurs, je voulais faire une fiche avec des transitions, qui paraît ordinaire à vue de nez mais qui cache quelques petits trucs sympas. Donc bien obligée de passer par :hover et :focus, et s'il existe un moyen de les "melanger" au html je ne le connais pas et je doute que ce soit recommandé. ^^



    A-Lice
    FémininAge : 22Messages : 4939

    le Mar 7 Avr 2015 - 21:46

    Ah ok x) Je comprends mieux, je n'ai pas testé le code et je l'ai survolé donc je n'avais pas vu les focus :hum: D'acc, préviens-moi quand ce sera fait Razz

    Elysia
    FémininAge : 17Messages : 139

    le Mer 8 Avr 2015 - 15:34

    Voilà c'est fait ! Je crois n'avoir rien oublié, j'ai vérifié plusieurs fois mais on n'est pas à l'abri d'une coquille. :hum:



    A-Lice
    FémininAge : 22Messages : 4939

    le Mer 8 Avr 2015 - 18:36

    C'est nikel, je déplace !

    Cydae
    FémininAge : 24Messages : 99

    le Sam 11 Avr 2015 - 22:20

    Merci!
    Yogi Nakagawa
    MasculinAge : 16Messages : 92

    le Dim 12 Avr 2015 - 3:49

    J'aime bien, c'est sobre et plutôt bien fait!



    Sakura Yuuki
    FémininAge : 15Messages : 75

    le Dim 12 Avr 2015 - 15:38

    Michi *O*



    Alessea
    FémininAge : 19Messages : 72

    le Dim 12 Avr 2015 - 18:54

    J'adore cette fiche, merci beaucoup pour le partage ! x3
    Haniwa
    FémininAge : 22Messages : 206

    le Dim 12 Avr 2015 - 22:02

    Merci
    Eden Friedjörg
    FémininAge : 23Messages : 16

    le Mar 14 Avr 2015 - 12:05

    Merci du partage, et le travail est vraiment excellent ! Bravo !
    Meylah
    FémininAge : 15Messages : 60

    le Mar 14 Avr 2015 - 14:52

    Merci
    SallyBoogeyman
    FémininAge : 18Messages : 10

    le Jeu 16 Avr 2015 - 11:30

    Merci !



    Equestria
    FémininAge : 19Messages : 116

    le Ven 17 Avr 2015 - 6:26

    merci
    Arima
    MasculinAge : 21Messages : 11

    le Sam 25 Avr 2015 - 20:08

    Merci !
    Asuka
    FémininAge : 22Messages : 104

    le Lun 27 Avr 2015 - 10:26

    Merci ♥



    Anselm
    MasculinAge : 25Messages : 151

    le Lun 27 Avr 2015 - 16:32

    Merci pour ce code !
    Arkadiaz
    MasculinAge : 28Messages : 3

    le Lun 27 Avr 2015 - 18:12

    J'aime bien, c'est sobre, jolie et bien harmonisé. Je te la pique =)
    Inamio
    FémininAge : 24Messages : 209

    le Jeu 30 Avr 2015 - 23:28

    Merci c'est tres chouette !



    Kanra
    FémininAge : 16Messages : 113

    le Ven 1 Mai 2015 - 0:19

    Merci ^^
    Velasta
    FémininAge : 27Messages : 34

    le Jeu 7 Mai 2015 - 23:17

    Oh Merci *^*
    ShamLash
    FémininAge : 20Messages : 11

    le Ven 8 Mai 2015 - 10:22

    Sankyu~
    Zorua
    MasculinAge : 16Messages : 28

    le Ven 8 Mai 2015 - 14:19

    OMGOMGOMGOMG C'est trop beau! Dis, dis, dis, tu sais que tu fais du beau travail? Franchement GG, et merci pour le partage, je prends volontiers ^^



    Si tu t'plantes dans les dimensions de ton vava tape dans tes mains ~

    *CLAP *CLAP*
    TheDrakLord
    MasculinAge : 20Messages : 54

    le Sam 9 Mai 2015 - 11:42

    Merci



    Contenu sponsorisé

    Aujourd'hui à 15:05


      La date/heure actuelle est Mar 6 Déc 2016 - 15:05