En fait ce serait plutôt "Le codage pour les graphistes 8D" LE CODAGE POUR LES FLEMMARDS *comme moi quoi*
Alors en fait l'astuce, c'est de faire le fond... C'est déjà une première approche au codage, ce sera votre base. C'est très simple Alors vous faites votre "planche". Armez vous d'imagination ! Vous n'êtes pas graphiste pour rien ! (J'ai fait ça : https://i.imgur.com/UtdL9MV.png )
CODAGE POUR LES NULS N°2
Alors c'est un peu pareil que le premier numéro, ce sera juste le centrage des éléments qu'on va voir ici. Par exemple cette div n'est pas au centre mais sur la gauche, pareil pour le titre. La div qui est en bas est pareil que ce que nous avons vu précédemment, pareil pour le fond. Mais je vais ré-expliquer au cas où Je copie/colle ce que j'ai écrit précédemment : Alors j'ai pris cette image : https://i.imgur.com/UtdL9MV.png
Ensuite il faudra donc que cette image soit votre fond. Fond se dit "Background" en anglais (et oui l'anglais vous suivra partout è_é ) Bref, vous voulez que ce background soit une image. Facile, ça donne ....?? *Dora* Background-image, bravo !! Bon alors pour mettre un fond, il vous faut le mettre dans la balise "div style".
Code:
<div style="background-image:url('')">
Ah oui j'avais oublié, il faut mettre url aussi, puis vous collez l'adresse url entre la parenthèse et l'apostrophe ainsi :
Chaque élément mis est très important n'enlevez rien è_é Maintenant les dimensions de l'image ! Height est la hauteur, Width est la largeur, en px le tout ! Espacez vos éléments avec ";", ça vous donne :
Le titre On se place avant la /div et on crée une autre div style. Si vous n'appliquez rien à cette div, votre titre sera centré, or j'ai fait exprès d'avoir mis une case vers la gauche comme ça vous saurez si jamais vous voulez décaler un titre :PIl y a plusieurs méthodes pour le décaler, mais pour ne pas tout de suite vous faire du bourrage de crâne, j'ai choisi la méthode simple (la méthode dure viendra après 8D). Bref si votre case est à gauche, vous écrivez text-align:left; (left=gauche), si il est à droite, vous écrivez text-align:right; (right=droite). Le mien est à gauche. Pour ne pas qu'il touche le bord du cadre, je le centre avec un padding:XXpx. Enfin pour placer mon texte où je veux, je lui applique une largeur (width) plus grande et je prévisualise plusieurs fois pour bien centré mon texte. Par exemple je commence avec 300px, puis 400px, puis 450px 410, 430 etc... Tout dépend de votre planche bien sûr ! Je rajoute un height:auto, je ferme les balises, ce qui nous donne :
Code:
<center><div style="background-image:url('http://i.imgur.com/UtdL9MV.png'); width :540px; height:605px;"><div style="width:430px;height:auto;text-align:left;padding:7px;">TITRE TITRE TITRE </div> </div></center>
Le titre est un peu petit pour un titre, on va donc ajouter la balise font size qui se compte en pts ! Ca grandit vite cette unité
N'oubliez pas de toujours bien fermer vos balises ! Le titre est fait, passons à la div à gauche !
Div à gauche Pas trop morts, vous tenez le coup ? Ca devrait aller plus vite si vous avez bien suivi ! C'est comme pour le premier numéro de Codage pour les nuls ! Donc pour le texte à l'intérieur, ouvrez une nouvelle div. Mettez y width et height comme vous le voulez un petit coup de padding de 3 à 7 px de préférence et un overflow:auto ! Késako ? Rappel : width : largeur en px height : hauteur en px padding : marge à l'intérieur de votre div en px overflow:auto : scrollbar (le déroulant) Bon vous avez ça :
Code:
<center><div style="background-image:url('http://i.imgur.com/UtdL9MV.png'); width :540px; height:605px;"><div style="width:430px;height:auto;text-align:left;padding:7px;"><font size="4pts">TITRE TITRE TITRE</font></div>
J'ai sauté 3 lignes pour que ça rentre dans la case, encore là tout dépend de votre fond. Mais là, votre div est centré. Il faudra donc utiliser margin pour y remédier. Margin, c'est la marge autour de votre div (ne pas confondre avec padding qui est la marge à l'intérieur). Bref cette margin (comme le padding d'ailleurs) peut avoir plusieurs attribut : margin-left, margin-right, margin-bottom (en bas), margin-top (en haut). Si vous ne mettez pas d'attribut, ce sera fait pour toutes les margin, pareil pour le padding. Moi je veux que ma div soit vers la gauche. Je vais utiliser margin-left pour la réduire. Donc je teste avec plusieurs nombre de 100 à 500px à l'aveuglette et je trouve *-* Pour voir si tout est bon, mettez un long texte dans la votre div, histoire de voir si tout est bien centré et si la scroll bar marche bien !
Code:
<center><div style="background-image:url('http://i.imgur.com/UtdL9MV.png'); width :540px; height:605px;"><div style="width:430px;height:auto;text-align:left;padding:7px;"><font size="4pts">TITRE TITRE TITRE</font></div>
Bonjour ! Bienvenue dans ma tanière, là où vous pouvez vous procurez pleins de choses !
Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8: Boutique en construction :lapin8:
Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours Travaux en cours
EDIT : En fait pourquoi il y a un espace avant mon texte ? :pandasad:
Dernière édition par Louve Ailée le Mer 8 Juin - 9:00, édité 1 fois
Hey petits fruits, bienvenue dans ma petite boutique o/ !
Je me tiens volontaire pour répondre à vos commandes, alors venez, veneeeeez ~ Je ne prends pas plus que 4 commandes à la fois et je prends momentanément en charge que des avatars. Merci de respecté mon travail et, voici le formulaire si vous commandez un menu chez moi
Code:
[b]♔Type de création [/b](Avatar): Réponse ici [b]♔Image/gif a utilisé[/b]: Réponse ici [b]♔Ambiance souhaité:[/b] Réponse ici [b]♔Dimensions:[/b] Réponse ici [b]♔Texte(s):[/b] Réponse ici [b]♔Autres: [/b]Réponse ici
Exemples d'avatars:
Arya Léviathan des Nymphes
Messages : 4012 Date d'inscription : 14/07/2015 Age : 27
Ac ne quis a nobis hoc ita dici forte miretur, quod alia quaedam in hoc facultas sit ingeni, neque haec dicendi ratio aut disciplina, ne nos quidem huic uni studio penitus umquam dediti fuimus. Etenim omnes artes, quae ad humanitatem pertinent, habent quoddam commune vinculum, et quasi cognatione quadam inter se continentur.
Dumque ibi diu moratur commeatus opperiens, quorum translationem ex Aquitania verni imbres solito crebriores prohibebant auctique torrentes, Herculanus advenit protector domesticus, Hermogenis ex magistro equitum filius, apud Constantinopolim, ut supra rettulimus, populari quondam turbela discerpti. quo verissime referente quae Gallus egerat, damnis super praeteritis maerens et futurorum timore suspensus angorem animi quam diu potuit emendabat.
Principium autem unde latius se funditabat, emersit ex negotio tali. Chilo ex vicario et coniux eius Maxima nomine, questi apud Olybrium ea tempestate urbi praefectum, vitamque suam venenis petitam adseverantes inpetrarunt ut hi, quos suspectati sunt, ilico rapti conpingerentur in vincula, organarius Sericus et Asbolius palaestrita et aruspex Campensis.
Sous titre
Si il y a reproduction partielle ou totale, Chibiterasu vous mord. Ac ne quis a nobis hoc ita dici forte miretur, quod alia quaedam in hoc facultas sit ingeni, neque haec dicendi ratio aut disciplina, ne nos quidem huic uni studio penitus umquam dediti fuimus. Etenim omnes artes, quae ad humanitatem pertinent, habent quoddam commune vinculum, et quasi cognatione quadam inter se continentur.
Dumque ibi diu moratur commeatus opperiens, quorum translationem ex Aquitania verni imbres solito crebriores prohibebant auctique torrentes, Herculanus advenit protector domesticus, Hermogenis ex magistro equitum filius, apud Constantinopolim, ut supra rettulimus, populari quondam turbela discerpti. quo verissime referente quae Gallus egerat, damnis super praeteritis maerens et futurorum timore suspensus angorem animi quam diu potuit emendabat.
Principium autem unde latius se funditabat, emersit ex negotio tali. Chilo ex vicario et coniux eius Maxima nomine, questi apud Olybrium ea tempestate urbi praefectum, vitamque suam venenis petitam adseverantes inpetrarunt ut hi, quos suspectati sunt, ilico rapti conpingerentur in vincula, organarius Sericus et Asbolius palaestrita et aruspex Campensis.
Ac ne quis a nobis hoc ita dici forte miretur, quod alia quaedam in hoc facultas sit ingeni, neque haec dicendi ratio aut disciplina, ne nos quidem huic uni studio penitus umquam dediti fuimus. Etenim omnes artes, quae ad humanitatem pertinent, habent quoddam commune vinculum, et quasi cognatione quadam inter se continentur.
Dumque ibi diu moratur commeatus opperiens, quorum translationem ex Aquitania verni imbres solito crebriores prohibebant auctique torrentes, Herculanus advenit protector domesticus, Hermogenis ex magistro equitum filius, apud Constantinopolim, ut supra rettulimus, populari quondam turbela discerpti. quo verissime referente quae Gallus egerat, damnis super praeteritis maerens et futurorum timore suspensus angorem animi quam diu potuit emendabat.
Principium autem unde latius se funditabat, emersit ex negotio tali. Chilo ex vicario et coniux eius Maxima nomine, questi apud Olybrium ea tempestate urbi praefectum, vitamque suam venenis petitam adseverantes inpetrarunt ut hi, quos suspectati sunt, ilico rapti conpingerentur in vincula, organarius Sericus et Asbolius palaestrita et aruspex Campensis.