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 violette

    Partagez
    avatar
    Lazulijune
    FémininAge : 19Messages : 11

    le Mar 6 Déc 2016 - 18:59



    Bonjour !
    Je poste mon deuxième codage, qui est à nouveau une réponse de rp, cette fois-ci de couleur violette. Évidemment, vous êtes libre de modifier les couleurs selon votre bon vouloir. L'important est que le crédit ne soit pas enlevé.




    « Titre du rp »
    Nom des participants

    Sin autem ad adulescentiam perduxissent, dirimi tamen interdum contentione vel uxoriae condicionis vel commodi alicuius, quod idem adipisci uterque non posset. Quod si qui longius in amicitia provecti essent, tamen saepe labefactari, si in honoris contentionem incidissent; pestem enim nullam maiorem esse amicitiis quam in plerisque pecuniae cupiditatem, in optimis quibusque honoris certamen et gloriae; ex quo inimicitias maximas saepe inter amicissimos exstitisse. Saraceni tamen nec amici nobis umquam nec hostes optandi, ultro citroque discursantes quicquid inveniri poterat momento temporis parvi vastabant milvorum rapacium similes, qui si praedam dispexerint celsius, volatu rapiunt celeri, aut nisi impetraverint, non inmorantur. His cognitis Gallus ut serpens adpetitus telo vel saxo iamque spes extremas opperiens et succurrens saluti suae quavis ratione colligi omnes iussit armatos et cum starent attoniti, districta dentium acie stridens adeste inquit viri fortes mihi periclitanti vobiscum.

    Sin autem ad adulescentiam perduxissent, dirimi tamen interdum contentione vel uxoriae condicionis vel commodi alicuius, quod idem adipisci uterque non posset. Quod si qui longius in amicitia provecti essent, tamen saepe labefactari, si in honoris contentionem incidissent; pestem enim nullam maiorem esse amicitiis quam in plerisque pecuniae cupiditatem, in optimis quibusque honoris certamen et gloriae; ex quo inimicitias maximas saepe inter amicissimos exstitisse. Saraceni tamen nec amici nobis umquam nec hostes optandi, ultro citroque discursantes quicquid inveniri poterat momento temporis parvi vastabant milvorum rapacium similes, qui si praedam dispexerint celsius, volatu rapiunt celeri, aut nisi impetraverint, non inmorantur. His cognitis Gallus ut serpens adpetitus telo vel saxo iamque spes extremas opperiens et succurrens saluti suae quavis ratione colligi omnes iussit armatos et cum starent attoniti, districta dentium acie stridens adeste inquit viri fortes mihi periclitanti vobiscum.



    Code:
    <link href="https://fonts.googleapis.com/css?family=Dancing+Script|Dosis" rel="stylesheet" />
    <div style="width:500px; margin:auto; background-color: #D5C7DC; border: 2px solid #A485B3; border-bottom: 2px dashed #A485B3;">
    <div style="margin-top: 5px; margin: auto; border: 3px double #8B6C9B; width:450px;"><img src="http://zupimages.net/up/16/49/bhgr.gif" style="width:450px;" /></div>
    <div style="font-family:Dancing Script; font-size:40px; text-align: center; color:#7B329F; padding-top:5px; font-weight: bold;">« Titre du rp »</div><div style="font-family:Dosis; font-size: 11px; color: #9973AC; text-align: center;">Nom des participants</div>
    <div style="width: 450px; height: 400px; overflow:auto; background-color: #DED4E3; margin: auto; border-left: 2px solid #AC92B9; border-right: 2px solid #AC92B9; padding: 3px; font-size: 12px;  text-align: justify; font-family:Dosis; color: black;">Sin autem ad adulescentiam perduxissent, dirimi tamen interdum contentione vel uxoriae condicionis vel commodi alicuius, quod idem adipisci uterque non posset. Quod si qui longius in amicitia provecti essent, tamen saepe labefactari, si in honoris contentionem incidissent; pestem enim nullam maiorem esse amicitiis quam in plerisque pecuniae cupiditatem, in optimis quibusque honoris certamen et gloriae; ex quo inimicitias maximas saepe inter amicissimos exstitisse. Saraceni tamen nec amici nobis umquam nec hostes optandi, ultro citroque discursantes quicquid inveniri poterat momento temporis parvi vastabant milvorum rapacium similes, qui si praedam dispexerint celsius, volatu rapiunt celeri, aut nisi impetraverint, non inmorantur. His cognitis Gallus ut serpens adpetitus telo vel saxo iamque spes extremas opperiens et succurrens saluti suae quavis ratione colligi omnes iussit armatos et cum starent attoniti, districta dentium acie stridens adeste inquit viri fortes mihi periclitanti vobiscum. 

    Sin autem ad adulescentiam perduxissent, dirimi tamen interdum contentione vel uxoriae condicionis vel commodi alicuius, quod idem adipisci uterque non posset. Quod si qui longius in amicitia provecti essent, tamen saepe labefactari, si in honoris contentionem incidissent; pestem enim nullam maiorem esse amicitiis quam in plerisque pecuniae cupiditatem, in optimis quibusque honoris certamen et gloriae; ex quo inimicitias maximas saepe inter amicissimos exstitisse. Saraceni tamen nec amici nobis umquam nec hostes optandi, ultro citroque discursantes quicquid inveniri poterat momento temporis parvi vastabant milvorum rapacium similes, qui si praedam dispexerint celsius, volatu rapiunt celeri, aut nisi impetraverint, non inmorantur. His cognitis Gallus ut serpens adpetitus telo vel saxo iamque spes extremas opperiens et succurrens saluti suae quavis ratione colligi omnes iussit armatos et cum starent attoniti, districta dentium acie stridens adeste inquit viri fortes mihi periclitanti vobiscum. </div>
    <div style="font-size:9px; font-style: italic; text-align: right; padding: 5px"><a href="http://www.never-utopia.com/" style="color:black;">© Lazulijune</a></div></div>

    En espérant que cela vous plaise :yay:

    Edit : Étant donné que je ne peux pas répondre, je tiens quand même à remercier Shoki pour sa correction, ses conseils m'ont été très utile et je les ai appliqué à ce code.


    Dernière édition par Lazulijune le Sam 10 Déc 2016 - 18:44, édité 3 fois
    avatar
    Shoki
    FémininAge : 16Messages : 1310

    le Sam 10 Déc 2016 - 10:36

    Coucou et merci du partage !
    Ton rendu est très joli, mais comme tien n'est parfait, je viens regarder le code de cette fiche de plus près :toto: (oui, je suis une verte, mais j'espionne les bleus aussi, chut :hehe: )

    Les p'tites erreurs


    Donc, déjà, ceci :
    Code:
    margin-left: auto; margin-right: auto;
    Si tu remplaces par
    Code:
    margin: auto;
    tu as exactement le même effet, et ton code est très légèrement raccourci (dans un CSS de 15 lignes, y'a pas une grande différence, mais quand t'atteint la centaine voir la millième ligne...)

    Ensuite :
    Code:
    border-top: 2px solid #A485B3; border-bottom: 2px dashed #A485B3; border-left: 2px solid #A485B3; border-right: 2px solid #A485B3;
    Ca fait un petit peu long, tu ne trouva pas ? :toto: Au lieu d'utiliser trois fois la même chose à des endroits différents (parce que si je regarde, y'a juste la bordure du bas qui change par rapport à celle du haut et celle du bas), tu peux les réunir en une seule propriété, ce qui donnerait du coup :
    Code:
    border: 2px solid #A485B3; border-bottom: 2px dashed #A485B3;
    Et j'ai testé, ça fonctionne (normalement :hum:)

    Code:
    text-size: 12px;
    text-size ? Tiens, je connaissais pas :toto: Sérieusement, c'est plutôt
    Code:
    font-size: 12px;
    que tu voulais mettre ? J'ai trouvé ce petit problème à "Nom des participants" aussi.

    Les p'tites astuces qui sauvent la vie


    Dans ton code, j'ai remarqué que tu mettait le CSS directement dans les divs, comme ceci :
    Code:
    <div style="..."></div>
    Bon, là, ça va, c'est un code de message, mais quand tu vas vouloir passer aux templates ou que tu va vouloir faire des transitions, ça passera pas vraiment (entre nous, déjà que certains templates sont gros, si en plus tu encombre le tout de CSS... xD). Du coup, si un jour il te prends l'envie de faire une animation/une transition dans un code de fiche, vu que tu n'auras peut-être pas de feuille CSS sous la main, je te conseille d'utiliser ceci :
    Code:
    <style>/*Ton CSS*/</style>

    <!-- Et là t'auras ton HTML. Tu peux aussi mettre le CSS qui est dans les balises <style></style> en-dessous de ton HTML -->
    Bon, c'est peut-être pas très bien de faire ça, mais ça sauve la vie /paf/. Cette méthode t'obligera cependant à utiliser des class et des id (si tu ne sais pas ce que c'est, tu peux aller voir ceci).

    Peut-être que tu connaissais déjà ça, auquel cas je ne t'aurais rien appris *sors*


    A part donc ces petits points-là, j'ai testé le code, et je te laisse modifier les petits trucs :3





    avatar
    Onyx
    FémininAge : 24Messages : 3050

    le Mer 21 Déc 2016 - 4:25

    Salut!

    Tout me semble maintenant parfait alors je valide ce LS ! Il sera bientôt déplacé dans la zone appropriée Wink

    Merci du partage!

    PS : Tu dois toujours refermer les balises img avec un / à la fin Wink



    avatar
    Kizuro hoki
    MasculinAge : 22Messages : 40

    le Ven 28 Juil 2017 - 11:24

    Merci du partage :)
    avatar
    Kelalin
    FémininAge : 25Messages : 1721

    le Ven 28 Juil 2017 - 16:53

    Merci pour le partage !
    avatar
    icequeen38
    FémininAge : 25Messages : 47

    le Sam 2 Déc 2017 - 14:53

    merci
    Contenu sponsorisé


      La date/heure actuelle est Jeu 14 Déc 2017 - 14:03