TUTORIEL

Informations Diverses · Sujet: TUTORIEL Dim 15 Fév - 23:40

Bonjour/Bonsoir à tous et à toutes <3

Aujourd’hui, si je suis ici, c’est pour parler de CODAAAAGE (enfer des uns, et fun pour les autres) et en faire, ou du moins essayer, de mettre au point un Tutoriel basique, surtout pour en parler. Souvent sur les forums, ils sont incomplets. Dans le sens où ils mettent le codage, mais où, comment, et à quoi il sert, souvent l’information est incomplète, et mine de rien quand on débute en codage, ça n’aide pas. Du coup, je suis ici pour développer et éviter des c/c bêtes et méchants, et vous filer des astuces pour personnaliser vous-mêmes vos codages. A la suite de ce post, je prépare un Tutoriel pour un cheminement complet pour une création de fiche de RPs

Tout d’abord : le codage, ça sert à quoi, concrètement ?

Et bien à faire de jolies choses. C’est bête, mais le codage c’est ce qui permet de faire ces mises en formes de Réponses RPG que l’on voit un peu partout sur le forum, et qu’on trouve en Libre Service sur divers sites (Never-Utopia, Bazzart, Pub RPG Design, et tant d’autres). Même si certains ne les utilisent pas, pour les autres c’est toujours mieux de personnaliser leur post. D’ailleurs le codage est PARTOUT. Vous en utilisez forcément, que vous vous en rendiez compte ou non (a) Vous me croyez pas ? Voici un exemple tout con.

Code:

[color=#ff3300][b]- Bonjour, comment vas-tu ? [/b][/color]

—> - Bonjour, comment vas-tu ?

Voilà du code ! Et oui, même sans mettre de codages, vous en mettez toujours. Pour mettre en gras, en couleurs vos dialogues, etc. Mais ceci n’est que du BBcode, et ne permet pas de faire grand chose… Ici nous n’allons pas en parler, mais plus parler de HTML, qui se trouvent entre ces deux symboles « < > »

Le fonctionnement et l’utilisation d’une balise en codage.

Une balise en codage, ça fonctionne un peu comme celles en BBcode. Il faut les ouvrir, et ne surtout jamais oublier de les fermer, sans quoi, bah ça ne marche pas, et/ou ça fait tout buguer. C’est quelque chose de primordial en codage, il faut être précis à la virgule près. Un oubli de ponctuation, un oubli de balises, et le code ne fonctionnera pas, ce pourquoi au début il ne faut s’en tenir qu’à des bases simples, et augmenter la difficulté à partir du moment où ça va mieux.

Quelques exemples de codage pour le texte, équivalent au BBcode :

Code:

<b></b>

= Met le texte en gras

Code:

<i></i>

= Met le texte en italique

Code:

<u></u>

= Souligne le texte

Code:

<center></center>

= Aligne le texte.

Vous remarquerez que pour changer la taille ou la police, il n’y a pas d’équivalent, ou du moins il nécessite d’utiliser d’autres balises. Et c’est là qu’on va commencer à compliquer les choses.

La balise "div"

Je pense que pour ceux qui s’y connaissent un minimum et même ceux qui ne s’y connaissent pas, vous avez sans doute déjà du la voir quelque part cette balise "div" ,maintenant nous allons voir comment on l’utilise.

Ce qu’il faut déjà savoir c’est que rien ne sert d’écrire

Code:

<div>Bonjour</div>

ça n’aura absolument aucun effet. Cette balise a besoin de ce qu’on appelle des attributs pour agir. Div est un peu comme l’équivalent d’un bloc, et permettra de modifier uniquement ce qui se situe entre. Par exemple : (pour le moment je n’ajoute aucun attribut)

Code:

<div> Bonjour </div> =bloc 1
<div> Comment allez vous ? Moi ça va bien aujourd’hui.</div> = bloc 2

Les div, ici, permettent à l’ordinateur de différencier ces deux phrases, et de permettre de les personnaliser individuellement. Ce qui est bien pratique quand on veut faire un joli titre sans toucher au texte, et de mettre en forme le texte, sans toucher au titre. Bref les div sont surtout utiles pour séparer en éléments.

Maintenant, ajoutons-leur ces fameux attributs. Pour le bonjour, nous allons le grandir un peu, lui donner une police différente et une autre couleur.

Code:

<div style="font-size: 24px; color: #ff0000; font-family: Tahoma;">Bonjour</div>

Résultat:
Bonjour

Explications :

Pour le texte, comme nous ajoutons du style, il faut ajouter l’attribut style à la balise, d’où le "div style" Il permet de faire comprendre qu’on va le mettre en forme. On lui donne un peu des ordres, z’avez vu ? Mais pour ça, il est TOUJOURS nécessaire d’ajouter le symbole égal (=) et d’ouvrir les guillemets ("). Les guillemets sont très importants, tout comme le égal, les doubles points, et points-virgules que vous pouvez voir plus haut. L’ordinateur n’est pas humain, c’est une intelligence artificielle, il ne fonctionne que si on lui dit exactement ce qu’il faut faire, et ne tolérera pas d’oubli, en se disant « bon c’est pas grave, je vais corriger à sa place », du coup c’est pour ça que c’est si important.

Voici quelques exemples d’attributs pour personnaliser un texte.

Font-size : VALEURpx ; changera la taille du texte.
Font-family : police ; modifiera la police
Color : #000000 ; la couleur
Text-align : center/justify/left/right ; sa position

Et pour ceux que ça ne suffit pas :

Text-shadow: VALEURpx VALEURpx VALEURpx #000000 ; permet de mettre une ombre au texte

(ASTUCE SUPPLEMENTAIRE, la police grâce à Google Fonts)

Vous rendre sur ce site : Google Fonts
Choisir une police et cliquer sur l’icône avec la flèche qui part vers la droite (->)
Vous atterrissez sur une page, avec deux belles lignes de code. Vous copiez la première, qui commence par "link href …" et la collez dans votre post (peu importe l’emplacement, cela n’a absolument aucune importance) c’est une balise qui ne nécessite pas d’être fermée (c’est une exception, avec une autre dont je ferais part plus tard)
Ensuite, vous avez une deuxième ligne, avec le fameux attribut Font-Family : et la police. Bien sur la copier comme ça et la coller bêtement ne servira à rien, il faudra donc avant tout activer notre fameuse balise.

Code:

<div style="font-family: 'Open Sans Condensed', sans-serif;"> TEXTE </div>

Et voilà, votre police est installée. Bien sur, vous pouvez changer la taille, la couleur, et sa position, en ajoutant à la suite, sachant qu’on construit toujours de cette manière :

Attribut : (double point) valeur ; (point-virgule)

Sans oublier de fermer les guillemets tout à la fin.

Img Src, la balise exception.

Parfois, on aime bien mettre des images dans nos rps, mais pour les insérer, vous utilisez habituellement la balise BBcode , tandis qu’en codage on utilise une balise plus simple, qui a le privilège de ne pas avoir à être fermée ensuite. Voyez vous-même.

Code:

<img src=" LE LIEN DE VOTRE IMAGE "/>

Et voilà, votre image est insérée. Simple comme bonjour, n’est-ce pas ? Alors ajoutons pour les courageux quelques attributs supplémentaires qui vous permettront en plus de faire en sorte que l’image se redimensionne toute seule (même plus besoin de traficoter sur des logiciels pour remettre vos images à la bonne taille (a)). Pour ce faire il faudra modifier la largeur (width) et la hauteur (height) comme ceci.

Code:

<img src=" LE LIEN DE VOTRE IMAGE " width="TAILLE" height="TAILLE"/>

FINI ! Vous n’avez plus qu’à essayer vous même

Conclusion

Ceci conclura le premier tutoriel qui concerne surtout les bases du codage, afin que vous puissiez déjà avec ces toutes petites leçons personnaliser vos textes, séparer le texte de l’image etc. Se lancer dans une explication complète est impossible étant donné toutes les possibilités que nous offre le codage. Ce pourquoi je me limiterais à là pour ça, histoire que vous vous familiarisiez déjà avec ces quelques notions (cela concernera surtout les débutants qui n’ont jamais codés de leur vie (a)) et que vous fassiez de petits tests de votre côté. Si jamais vous avez des questions, ou avez besoin d’avis, n’hésitez surtout pas, je suis là pour tenter de vous répondre au mieux.

Informations Diverses · Sujet: Re: TUTORIEL Lun 16 Fév - 1:33

Exemple:

Me revoilà pour la suite des évènements
Ce Tutoriel sera déjà plus complet, et nous mènera à la création du code que vous pouvez trouver dans le spoiler ci-dessus. C'est un code simple, mais qui nécessite quand même quelques petits codes, que je vais développer -au mieux- pour que vous puissiez le comprendre, et si possible pouvoir le personnaliser vous-même par la suite, voire mieux vous permettre de créer vos propres codages tous seuls comme des grands
J'espère qu'il vous plaira, et que ce sera compréhensible (a)

PREMIERE ETAPE : Le fond (alias la première div)

Avant de se précipiter et de penser aux images, au texte et au titre, il faut mettre en place le fond, et pour un codage comme celui-là c'est relativement primordial, et puis surtout c'est plutôt logique ! On y va étapes par étapes, comme on cuirait des pates, on ne les met pas dans la casserole avant l'eau, et bien là c'est pareil, le fond d'abord et le contenu ensuite!

Pour ce faire, on détermine déjà une taille, et ici seule la largeur suffira. Pourquoi? et bien si on détermine une hauteur, et que le texte finit par être plus grand, il débordera du cadre, alors que ne pas mettre de hauteur permettra au code de s'adapter en fonction du contenu.

Du coup, on met en place notre première div/premier bloc.

Code:

<div style="width: 500px;"></div>

Ici, je lui ai mis 500 px, qui est une taille relativement utilisée pour déterminer des largeurs, elle est ni trop grande, ni trop petite. Mais bien sur, juste ça ne suffira pas, et vous remarquerez que mon fond est blanc, il faut donc ajouter au code un nouvel attribut, ce qu'on appelle le background-color (pour les non-bilingues: couleur de fond ), ce à quoi on ajoutera la couleur voulue, ici #ffffff.

Code:

<div style="width: 500px; background-color: #ffffff;"></div>

Donc nous avons fini de mettre en place le fond! Mais bon, quand vous le tester, rien ne s'affiche et c'est normal! Maintenant il va falloir remplir tout ça

DEUXIEME ETAPE : les images, qui s'assemblent

Toujours dans l'ordre, nous allons installer le haut du code, ici composé de deux images. Et pour ceux qui auraient lu mon autre Tutoriel, rien de bien compliqué, il ne suffit que de mettre deux fois le même code.

Code:

<img src="IMG"/><img src="IMG"/>

Mais... Ce n'est pas tout! Evidemment, si vous casez juste comme ça vos deux images, que vous y casez un lien, les images n'en feront qu'à leur tête et auront une taille qui n'entre pas dans le code... Alors avant de paniquer, forçons le code à avoir des valeurs de référence, ce qui redimensionnera l'image automatiquement. Dans notre cas actuel, notre largeur de référence est de 500 pixels, et pour que ça soit un minimum esthétique, il est préférable que les deux images soient à 250px de largeur chacune (250+250 = 500, youhou trop forte même en code on fait des maths /pan), et par proportionnalité, pour que l'image ne soit pas déformée je leur ai mis à toutes les deux une hauteur de 150 pixels.

Code:

<img src="IMG" width="250" height="150"/><img src="IMG" width="250" height="150"/>

Voilà! Nous avons nos deux images de placées, nos deux images de dimensionnées, tout semble bon, n'est-ce pas? Et bien non, j'ai ajouté à ces images d'autres attributs encore. Mais lesquels? Je vous laisse deviner? Oh et puis non, je suis gentille, je vais vous dire ce que c'est (a)
Vous voyez en dessous de l'image cette large barre grise? Et bien je l'ai ajouté directement sous les images. Comment? en utilisant l'attribut border-bottom plaçant ainsi une bordure uniquement sur le bord en bas de l'image. Pour l'insérer dans un code, il suffira après le height, d'insérer un style.

Code:

<img src="IMG" width="250" height="150" style="border-bottom: 25px solid #cccccc;"/><img src="IMG" width="250" height="150" style="border-bottom: 25px solid #cccccc;"/>

(Remarquez qu'il faut se la jouer jumelle party, en mettant exactement la même chose aux deux images, sinon ça fait moche (a))

J'ai donc ajouté notre bordure, et je lui ai donné une épaisseur assez conséquente, ici 25px. Ensuite, j'ai déterminé son style : solid et sa couleur, en l'occurrence du gris.

Astuce a écrit:

Une bordure peut se composer et se personnaliser de manières différentes. Une bordure se compose toujours de l'attribut BORDER, ce à quoi on ajoute toujours TROIS valeurs. La taille en pixels, son style, et sa couleur. Pour la taille et la couleur, je n'ai pas besoin de vous apprendre grand chose, en revanche voici trois types de valeurs :
solid : ligne continue
dotted: petits pointillés
dashed : ligne discontinue
Il vous suffit juste de choisir lequel vous plait le plus, à jouer avec les couleurs et épaisseurs

EN PLUS: Pour ceux qui veulent pousser le vice, et faire des coins de bordures arrondis, il vous suffira d'ajouter ce code à la suite de votre border:

border-radius: VALEURpx;

Maintenant, c'est vraiment bon! Pour nos images c'est fini! Très personnellement, sur le code que je vous ai posté, j'ai ajouté un petit plus, qui n'est absolument pas nécessaire, j'ai réglé l'opacité, pour rendre ça moins brut. Donc pour les petits curieux, voilà comment ceci est rajouté et complété.

Code:

<img src="IMG" width="250" height="150" style="border-bottom: 25px solid #cccccc; opacity: 0.5;"/><img src="IMG" width="250" height="150" style="border-bottom: 25px solid #cccccc; opacity: 0.5;"/>

(Pour régler l'opacité, les valeurs sont à prendre en compte entre 0 & 1, sachant que 1 = opacité totale)

TROISIEME ETAPE : Monsieur le titre, et ses couleurs

Que ferait-on sans avoir de quoi mettre le joli titre de notre RP? Pas grand chose, pas vrai? Et bien voilà maintenant comme l'installer.

Tout d'abord, j'ai fouillé dans Google Fonts, une écriture qui me convenait (ICI) et je l'ai installé, dans un premier temps.

Code:

<link href='http://fonts.googleapis.com/css?family=Gloria+Hallelujah' rel='stylesheet' type='text/css'><div style="font-family: 'Gloria Hallelujah', cursive;">Titre de mon RP</div>

—
Titre de mon RP

Voilà ce que ça donne pour l'instant, et ce n'est que du c/c d'un site proposant de jolies écritures. Mais moi ça ne me satisfait pas, pas la taille, ni la couleur, ni la position que je veux sur mon code. Du coup, on va ajouter tout ça au fur et à mesure. Pour la taille je me sers de font-size pour la couleur de color.

Code:

<link href='http://fonts.googleapis.com/css?family=Gloria+Hallelujah' rel='stylesheet' type='text/css'><div style="font-family: 'Gloria Hallelujah', cursive; font-size: 36px; color: #cc3366;">Titre de mon RP</div>

Oh bah voilà, c'est déjà plus grand, et déjà plus coloré, mais c'est pas tout, je suis pointilleuse, j'aime jouer avec les codes, puisqu'ils permettent de faire pleins de choses, alors je mets de la surbrillance.

Astuce a écrit:

En utilisant l'attribut text-shadow -qui permet initialement de créer une ombre au texte-, on peut, en jouant avec les différentes valeurs créer différents effets, comme celui de donner l'impression que le texte est entouré d'une "aura", auquel cas, on écrira text-shadow: 0px 0px 3px #000000; Pour créer cet effet, il ne faudra bidouiller que la dernière valeur.

Ah voilà, mais étrangement ça ne me plait toujours pas, j'aimerais bien bouger le texte, le remonter un peu, pas vous? Ah si je le savais bien ! Alors allons-y!
Pour remonter le texte, il nous faut utiliser un attribut un peu spécial, le margin-top qui permet tout bêtement de déterminer la distance entre la marge supérieure et le texte. Donc en gros, pour remonter, il nous faudra réduire cette distance. Et ici j'ai mis margin-top: -20px; or si vous testez comme ça, vous remarquerez que votre texte se positionne en dessous de la bordure, et du coup ça fait pas beau :/ Mais on peut toujours palier à ça, en forçant sa position. Et du coup on utilise l'attribut..... SUSPENSE ...... position félicitations, aux heureux gagnants, et on lui donne la valeur Relative.

Monsieur cours de code a écrit:

Il existe plusieurs types de valeurs pour l'attribut position, dont les plus connus sont Absolute et Relative. Absolute forcera le code à se mettre en haut à gauche du bloc, tandis que Relative centrera le texte sans trop de résistance. Il existe évidemment d'autres valeurs comme top, bottom, left et right, mais dans le cas actuel, ils ont tendance à vouloir aller sous le bloc précédent, tandis que Relative et Absolute prennent le dessus. (ouuuuuh les dominants)

Donc voilà, ce que le code pour le titre donne :

Code:

<div style="font-family: 'Gloria Hallelujah', cursive; font-size: 36px; color: #cc3366; text-shadow: 0px 0px 3px #000000; position: relative; margin-top: -20px;">Titre de mon RP</div>

QUATRIEME PARTIE : La place pour notre texte, on est en RP après tout

C'est bon, vous suivez toujours? Au pire, faites une pause et venez relire après (a) Sinon pour les autres, on va passer à la phase finale, et au fond la plus importante, celle où on va poser notre RP, et donc nous créer une dernière div, notre dernier bloc. Et comme on veut qu'il s'accorde avec le reste, on va reprendre quelques codes qu'on a déjà vu au cours de ce Tutoriel.

- Déjà, la taille, notre div (block) aura comme largeur (width) 500px.
- Nous déterminerons une taille de l'écriture (font-size) de 12px, c'est largement suffisant en RP (sauf pour ceux qui ont besoin de hublots pour voir /pan/), et nous alignerons tout ça (text-align) en mode "justify", parce que c'est plus beau, voilà !

Code:

<div style="width: 500px; font-size: 12px; text-align: justify;">RP ICI</div>

Bah?! pourquoi chez toi y a des bordures grises encore, et pourquoi mon texte est aussi collé au bord? et bien parce qu'il manque quelques petits détails pour peaufiner le tout. Automatiquement le texte va se caller au bloc, mais si on ne dit pas à l'ordi d'aérer le tout en laissant des marges pour que le texte soit plus lisible, et bah il restera comme ça, ce pourquoi on utilise ce qu'on appelle l'attribut padding (et non pas margin (a)) moi je trouve ça plus pratique, surtout dans ce cas de figure. On lui ajoute en valeur 10px (le texte s'éloignera de 10 pixels de chaque bord du bloc), ensuite on lui ajoute les bordures grises. Mais le piège est là, il n'y en a que trois mais don't panic, regardez !

Code:

<div style="width: 500px; font-size: 12px; text-align: justify; padding: 10px; border-left: 1px solid #cccccc; border-right: 1px solid #cccccc; border-bottom: 1px solid #cccccc;">RP ICI</div>

Quand vous voulez dans une div ne mettre qu'une bordure, ou deux, ou trois, il vous suffit juste de les séparer en précisant le côté où vous voulez la voir apparaitre, en l'occurrence ici, à gauche, à droite et en bas.

Et du coup.... NOUS AVONS TOUT ! Maintenant il faut tout rassembler en un, mais pas n'importe comment, ATTENTION. Là l'erreur peut être dangereuse (ou pas /pan) puisque nous avons fait étape par étape. Il ne vous suffira pas de c/c tout à la suite, ça va tout fausser. Du moins, on pourrait, il y a juste un élément indispensable: LE FOND! Et oui, le fond doit TOUT englober. Sinon, ça donne ça :

Exemple:

Ca me déforme tout o_O et c'est pas bon. Pour que ça marche il faudra englober ce code :

Code:

<img src="http://24.media.tumblr.com/c32e9dad5a4bd70d46b61b3182900ad0/tumblr_n02nkoNxF71s0r1muo7_500.gif" width="250" height="150" style="border-bottom: 25px solid #cccccc; opacity: 0.5;"/><img src="http://25.media.tumblr.com/tumblr_m7fr79YQvX1qlte2zo1_500.gif" width="250" height="150" style="border-bottom: 25px solid #cccccc; opacity: 0.5;"/><div style="font-family: 'Gloria Hallelujah', cursive; font-size: 36px; color: #cc3366; text-shadow: 0px 0px 3px #000000; position: relative; margin-top: -20px;">Titre de mon RP</div><div style="text-align: justify; font-size: 12px; font-family: Times New Roman; border-left: 1px solid #cccccc; border-right: 1px solid #cccccc; border-bottom: 1px solid #cccccc; padding: 10px;">
Latius iam disseminata licentia onerosus bonis omnibus Caesar nullum post haec adhibens modum orientis latera cuncta vexabat nec honoratis parcens nec urbium primatibus nec plebeiis.

Soleo saepe ante oculos ponere, idque libenter crebris usurpare sermonibus, omnis nostrorum imperatorum, omnis exterarum gentium potentissimorumque populorum, omnis clarissimorum regum res gestas, cum tuis nec contentionum magnitudine nec numero proeliorum nec varietate regionum nec celeritate conficiendi nec dissimilitudine bellorum posse conferri; nec vero disiunctissimas terras citius passibus cuiusquam potuisse peragrari, quam tuis non dicam cursibus, sed victoriis lustratae sunt.

Et quia Montius inter dilancinantium manus spiritum efflaturus Epigonum et Eusebium nec professionem nec dignitatem ostendens aliquotiens increpabat, qui sint hi magna quaerebatur industria, et nequid intepesceret, Epigonus e Lycia philosophus ducitur et Eusebius ab Emissa Pittacas cognomento, concitatus orator, cum quaestor non hos sed tribunos fabricarum insimulasset promittentes armorum si novas res agitari conperissent.

Et Epigonus quidem amictu tenus philosophus, ut apparuit, prece frustra temptata, sulcatis lateribus mortisque metu admoto turpi confessione cogitatorum socium, quae nulla erant, fuisse firmavit cum nec vidisset quicquam nec audisset penitus expers forensium rerum; Eusebius vero obiecta fidentius negans, suspensus in eodem gradu constantiae stetit latrocinium illud esse, non iudicium clamans.

Martinus agens illas provincias pro praefectis aerumnas innocentium graviter gemens saepeque obsecrans, ut ab omni culpa inmunibus parceretur, cum non inpetraret, minabatur se discessurum: ut saltem id metuens perquisitor malivolus tandem desineret quieti coalitos homines in aperta pericula proiectare.</div>

(Ce code contient les images, le titre et la zone RP)

par notre tout premier code

Code:

<div style="width: 500px; background-color: #ffffff;"></div>

Comment procéder? Et bien, il suffit tout simplement de mettre la première partie du code, au tout début de notre code global, et tout à la fin, fermer avec la "/div" de fermeture. Comme si on encadrait le reste avec ce code là! Et le tour est joué!

Mais... Euh?! Mon code, il reste à gauche, comment je fais? Et bien, oui, souvent il le code de réponse reste à gauche, ce à quoi je réponds simplement, en ajoutant les balises "center", de cette façon, ce qui nous donne comme code définitif:

Code:

<link href='http://fonts.googleapis.com/css?family=Gloria+Hallelujah' rel='stylesheet' type='text/css'><center><div style="width: 500px; background-color: #ffffff;"><img src="http://24.media.tumblr.com/c32e9dad5a4bd70d46b61b3182900ad0/tumblr_n02nkoNxF71s0r1muo7_500.gif" width="250" height="150" style="border-bottom: 25px solid #cccccc; opacity: 0.5;"/><img src="http://25.media.tumblr.com/tumblr_m7fr79YQvX1qlte2zo1_500.gif" width="250" height="150" style="border-bottom: 25px solid #cccccc; opacity: 0.5;"/><div style="font-family: 'Gloria Hallelujah', cursive; font-size: 36px; color: #cc3366; text-shadow: 0px 0px 3px #000000; position: relative; margin-top: -20px;">Titre de mon RP</div><div style="text-align: justify; font-size: 12px; font-family: Times New Roman; border-left: 1px solid #cccccc; border-right: 1px solid #cccccc; border-bottom: 1px solid #cccccc; padding: 10px;">
Latius iam disseminata licentia onerosus bonis omnibus Caesar nullum post haec adhibens modum orientis latera cuncta vexabat nec honoratis parcens nec urbium primatibus nec plebeiis.

Soleo saepe ante oculos ponere, idque libenter crebris usurpare sermonibus, omnis nostrorum imperatorum, omnis exterarum gentium potentissimorumque populorum, omnis clarissimorum regum res gestas, cum tuis nec contentionum magnitudine nec numero proeliorum nec varietate regionum nec celeritate conficiendi nec dissimilitudine bellorum posse conferri; nec vero disiunctissimas terras citius passibus cuiusquam potuisse peragrari, quam tuis non dicam cursibus, sed victoriis lustratae sunt.

Et quia Montius inter dilancinantium manus spiritum efflaturus Epigonum et Eusebium nec professionem nec dignitatem ostendens aliquotiens increpabat, qui sint hi magna quaerebatur industria, et nequid intepesceret, Epigonus e Lycia philosophus ducitur et Eusebius ab Emissa Pittacas cognomento, concitatus orator, cum quaestor non hos sed tribunos fabricarum insimulasset promittentes armorum si novas res agitari conperissent.

Et Epigonus quidem amictu tenus philosophus, ut apparuit, prece frustra temptata, sulcatis lateribus mortisque metu admoto turpi confessione cogitatorum socium, quae nulla erant, fuisse firmavit cum nec vidisset quicquam nec audisset penitus expers forensium rerum; Eusebius vero obiecta fidentius negans, suspensus in eodem gradu constantiae stetit latrocinium illud esse, non iudicium clamans.

Martinus agens illas provincias pro praefectis aerumnas innocentium graviter gemens saepeque obsecrans, ut ab omni culpa inmunibus parceretur, cum non inpetraret, minabatur se discessurum: ut saltem id metuens perquisitor malivolus tandem desineret quieti coalitos homines in aperta pericula proiectare.</div> </div></center>

Et voilà ! Nous avons notre code au complet, il suffit de changer les images, le titre et le texte à notre guise! Vous pouvez vous en servir comme moyen de support, pour vous exercer, pour tester, et si jamais vous avez des questions, que vous voulez me soumettre un test, que vous avez un problème, n'hésitez surtout pas à m'en faire part, je répondrais avec joie

Sur ce, bonne lecture, et bon amusement <3

PS : dernière astuce pour la route. Pour tester un code, il est toujours mieux de le tester en condition, avec du texte dedans pour voir si ça rendra bien ou pas, ce pourquoi il existe ce site : http://www.faux-texte.com qui génère des faux textes. Pas franchement utile, mais pratique!

Informations Diverses · Sujet: Re: TUTORIEL Lun 23 Mar - 13:50

Je m'appelle Sashette et je suis une toute petit infobulette qui reste sur place, pour qu'on puisse cliquer sur les liens !

Sujet: Re: TUTORIEL