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.



2 résultats trouvés pour message_officiel

Cruelly

Fiche Administrative - Mar 26 Avr 2016 - 21:38



Fiche Administrative



HTML & CSS - Taille de la fiche :  500 - Aperçu 01 Aperçu 02 Aperçu 03

Bonjour, bonsoir à tous et à toutes :)

Voici une modification de ma fiche rp couleur claire. Celle-ci comporte quelque ajout et une version avec image ^^.


Code Css

 
Code:
/* -------------------------------- FICHE RP  PAR CRUELLY -------------------------------- */

        .Fond {
        width: 500px;
        background-color: #C6C9D8;
        margin :auto;
        box-shadow: 0px 0px 5px #ffffff;
        }

        .Fond p {
        font-size: 12px;
         margin-left: 10px;
        margin-right: 10px;
         color: #555555;
        text-align: justify;
        font-family: arial;
        text-shadow: 0px 0px 5px #ffffff;
        }
        
        .Parg {
        width: 440px;
        background-color: #AAAFC4;
          margin :auto;
        box-shadow: 0px 0px 5px #888888;
        }
        

        .Fond h4 {
        font-family: 'Monotype corsiva', cursive;
        color: #ffffff;
        font-size: 40px;
        font-style: italic;
        background-color: #8C99AE;
        text-align: center;
        text-shadow: 0px 0px 2px #ffffff;
        }

        .Cred1 {
        font-size: 10px;
        color: #ffffff;
        text-align: center;
        font-family: arial;
        }
/* -------------------------------- FIN FICHE RP  -------------------------------- */



HTML Fiche 01

 
Code:
<div class="Fond"><H4>Ton titre super classe</H4><div class="Parg"><p>Inter quos Paulus eminebat notarius ortus in Hispania, glabro quidam sub vultu latens, odorandi vias periculorum occultas perquam sagax. is in Brittanniam missus ut militares quosdam perduceret ausos conspirasse Magnentio, cum reniti non possent, iussa licentius supergressus fluminis modo fortunis conplurium sese repentinus infudit et ferebatur per strages multiplices ac ruinas, vinculis membra ingenuorum adfligens et quosdam obterens manicis, crimina scilicet multa consarcinando a veritate longe discreta. unde admissum est facinus impium, quod Constanti tempus nota inusserat sempiterna.</p>
</div><div class="Cred1">(c) Cruelly pour <a href="http://www.never-utopia.com">Never Utopia</a>.</div>
</div>



HTML Fiche 02


Code:
<div class="Fond"><H4>Ton titre super classe</H4><div class="Parg"><p>Inter quos Paulus eminebat notarius ortus in Hispania, glabro quidam sub vultu latens, odorandi vias periculorum occultas perquam sagax. is in Brittanniam missus ut militares quosdam perduceret ausos conspirasse Magnentio, cum reniti non possent, iussa licentius supergressus fluminis modo fortunis conplurium sese repentinus infudit et ferebatur per strages multiplices ac ruinas, vinculis membra ingenuorum adfligens et quosdam obterens manicis, crimina scilicet multa consarcinando a veritate longe discreta. unde admissum est facinus impium, quod Constanti tempus nota inusserat sempiterna.</p><H4>Ton titre super classe</H4><p>Inter quos Paulus eminebat notarius ortus in Hispania, glabro quidam sub vultu latens, odorandi vias periculorum occultas perquam sagax. is in Brittanniam missus ut militares quosdam perduceret ausos conspirasse Magnentio, cum reniti non possent, iussa licentius supergressus fluminis modo fortunis conplurium sese repentinus infudit et ferebatur per strages multiplices ac ruinas, vinculis membra ingenuorum adfligens et quosdam obterens manicis, crimina scilicet multa consarcinando a veritate longe discreta. unde admissum est facinus impium, quod Constanti tempus nota inusserat sempiterna.</p></div><div class="Cred1">(c) Cruelly pour <a href="http://www.never-utopia.com">Never Utopia</a>.</div>
</div>



HTML Fiche 03


Code:
<div class="Fond"><H4>Ton titre super classe</H4><div class="Parg"><div style=" height: 118px; background: url(http://image.noelshack.com/fichiers/2016/17/1461639114-sans-titre-2.png); "></div><p>Inter quos Paulus eminebat notarius ortus in Hispania, glabro quidam sub vultu latens, odorandi vias periculorum occultas perquam sagax. is in Brittanniam missus ut militares quosdam perduceret ausos conspirasse Magnentio, cum reniti non possent, iussa licentius supergressus fluminis modo fortunis conplurium sese repentinus infudit et ferebatur per strages multiplices ac ruinas, vinculis membra ingenuorum adfligens et quosdam obterens manicis, crimina scilicet multa consarcinando a veritate longe discreta. unde admissum est facinus impium, quod Constanti tempus nota inusserat sempiterna.</p>
</div><div class="Cred1">(c) Cruelly pour <a href="http://www.never-utopia.com">Never Utopia</a>.</div>
</div>

Shaneliae

Fiche officielle Démons - Sam 26 Déc 2015 - 19:02


Fiche officielle Démons



Bonjour et bienvenue pour ce nouveau LS !

Aujourd'hui je vous propose un petit LS type "fiche officielle" pour ayant un thème démoniaque et sombre tout en noir et rouge. La fiche en elle-même est très simple, il n'y a pas d'effets de transition ou autre. L'image d'en tête a été modifié par moi-même et toutes les autres images ont été réalisé par moi-même. Il y a différents niveaux de titre, le titre 1 étant le titre "général" de la fiche, et les titres 2 et 3 les sous-titres et sous-sous-titres.

Le rendu en direct de la fiche
Une capture d'écran de la fiche (le fond bleu correspond au fond de mon forum test)


Le code HTML



Pour petit rappel, le code HTML est le code à insérer directement dans votre message.
Code:
<div class="fiche_demons">
  <span class="titre1_demons">Titre 1</span>
  <span class="titre2_demons">Titre 2</span>
  <span class="titre3_demons">Titre 3</span>
  <div class="texte_demons">Intellectum est enim mihi quidem in multis, et maxime in me ipso, sed paulo ante in omnibus, cum M. Marcellum senatui reique publicae concessisti, commemoratis praesertim offensionibus, te auctoritatem huius ordinis dignitatemque rei publicae tuis vel doloribus vel suspicionibus anteferre. Ille quidem fructum omnis ante actae vitae hodierno die maximum cepit, cum summo consensu senatus, tum iudicio tuo gravissimo et maximo. Ex quo profecto intellegis quanta in dato beneficio sit laus, cum in accepto sit tanta gloria.

Apud has gentes, quarum exordiens initium ab Assyriis ad Nili cataractas porrigitur et confinia Blemmyarum, omnes pari sorte sunt bellatores seminudi coloratis sagulis pube tenus amicti, equorum adiumento pernicium graciliumque camelorum per diversa se raptantes, in tranquillis vel turbidis rebus: nec eorum quisquam aliquando stivam adprehendit vel arborem colit aut arva subigendo quaeritat victum, sed errant semper per spatia longe lateque distenta sine lare sine sedibus fixis aut legibus: nec idem perferunt diutius caelum aut tractus unius soli illis umquam placet.

Atque, ut Tullius ait, ut etiam ferae fame monitae plerumque ad eum locum ubi aliquando pastae sunt revertuntur, ita homines instar turbinis degressi montibus impeditis et arduis loca petivere mari confinia, per quae viis latebrosis sese convallibusque occultantes cum appeterent noctes luna etiam tum cornuta ideoque nondum solido splendore fulgente nauticos observabant quos cum in somnum sentirent effusos per ancoralia, quadrupedo gradu repentes seseque suspensis passibus iniectantes in scaphas eisdem sensim nihil opinantibus adsistebant et incendente aviditate saevitiam ne cedentium quidem ulli parcendo obtruncatis omnibus merces opimas velut viles nullis repugnantibus avertebant. haecque non diu sunt perpetrata.</div>
  <div class="credits_demons"><a href="http://www.never-utopia.com/">(c) Shaneliae | Never Utopia</a></div>
</div>
<link href='https://fonts.googleapis.com/css?family=Cinzel:400,700,900|Calligraffitti' rel='stylesheet' type='text/css'>


Si vous souhaitez ajouter un titre de niveau 1, utilisez ce code :
Code:
<span class="titre1_demons">Votre titre 1</span>


Si vous souhaitez ajouter un titre de niveau 2, utilisez ce code :
Code:
<span class="titre2_demons">Votre titre 2</span>


Si vous souhaitez ajouter un titre de niveau 3, utilisez ce code :
Code:
<span class="titre3_demons">Votre titre 3</span>


Après vos titres, vous devez insérer votre texte dans des balises comme ceci :
Code:
<div class="texte_demons">Votre texte à mettre ici</div>


Si vous avez les droits de fondation de votre forum et que vous utilisez cette fiche comme fiche officielle pour votre forum, vous pouvez supprimer la dernière ligne de code et la mettre dans le template overall_header :
Code:
<link href='https://fonts.googleapis.com/css?family=Cinzel:400,700,900|Calligraffitti' rel='stylesheet' type='text/css'>


Le CSS



Pour rappel, le CSS est la partie qui va donner le "style" de votre fiche. Sans lui votre HTML ne servira à rien !

Si vous êtes admin du forum...


Dans le cas où vous êtes un admin du forum où cette fiche est utilisée, vous devez utiliser le code ci-dessous que vous allez copier/coller dans Panneau d'admin > Affichage > Images & Couleur > Couleurs > Feuille de style CSS :
Code:
/***** FICHE DEMONS *****/
/* Cadre de la fiche */
.fiche_demons {
  width: 600px;
  background: url('http://img11.hostingpics.net/pics/602762Sanstitre.png') top center no-repeat, url('http://img11.hostingpics.net/pics/436405Sanstitre2.png') bottom center no-repeat;
  background-color: #000000;
  margin: auto;
  padding-top: 360px;
  padding-bottom: 100px;
  border-top: 5px solid #5f2d27;
  border-right: 1px solid #5f2d27;
  border-bottom: 5px solid #5f2d27;
  border-left: 1px solid #5f2d27;
  border-radius: 50px;
  box-shadow: 0px 0px 5px #000000;
}
/* Titres de la fiche */
.titre1_demons {
  color: #5f2d27;
  font-family: 'Cinzel', serif;
  font-weight: normal;
  font-size: 25px;
  text-align: center;
  text-shadow: 1px 1px 5px #5c3b35;
  width: 100%;
  height: 70px;
  padding-top: 40px;
  margin-bottom: 30px;
  display: inline-block;
  background: url('http://img11.hostingpics.net/pics/682400titre1.png') top center no-repeat #000000;
}
.titre2_demons {
  color: #5c221c;
  font-family: 'Cinzel', serif;
  font-weight: normal;
  font-size: 18px;
  text-align: center;
  text-shadow: 1px 1px 10px #5c504e;
  width: 100%;
  height: 40px;
  padding-top: 15px;
  display: inline-block;
  background: url('http://img15.hostingpics.net/pics/225898titre2.png') top center no-repeat #000000;
}
.titre3_demons {
  color: #9c2d1e;
  font-family: 'Calligraffitti', cursive;
  font-weight: normal;
  font-size: 18px;
  text-shadow: 0px 0px 2px #9c2d1e;
  text-align: left;
  padding-top: 15px;
  padding-left: 30px;
  display: inline-block;
}
/* Style du texte de la fiche */
.texte_demons {
  color: #71616b;
  font-size: 12px;
  padding-top: 5px;
  padding-left: 15px;
  padding-right: 15px;
  text-align: justify;
}
/* Style du crédit vers Never Utopia */
.credits_demons {
  font-size: 8px;
  text-align: center;
  width: 100%;
  padding-top: 20px;
}
.credits_demons a {
  color: #71616b;
  text-decoration: none !important;
  transition: 100ms ease all;
  font-family: 'Cinzel', serif;
}
.credits_demons a:hover {
  color: #44120d;
  transition: 100ms ease all;
}


Si vous n'êtes pas admin du forum...


Si vous souhaitez utilisez ce LS sur un forum où vous n'êtes pas admin, utilisez le CSS ci-dessous que vous insérez tout au début de votre message suivi de votre HTML :
Code:
<style>.fiche_demons{width: 600px; background: url('http://img11.hostingpics.net/pics/602762Sanstitre.png') top center no-repeat, url('http://img11.hostingpics.net/pics/436405Sanstitre2.png') bottom center no-repeat; background-color: #000000; margin: auto; padding-top: 360px; padding-bottom: 100px; border-top: 5px solid #5f2d27; border-right: 1px solid #5f2d27; border-bottom: 5px solid #5f2d27; border-left: 1px solid #5f2d27; border-radius: 50px; box-shadow: 0px 0px 5px #000000;}.titre1_demons{color: #5f2d27; font-family: 'Cinzel', serif; font-weight: normal; font-size: 25px; text-align: center; text-shadow: 1px 1px 5px #5c3b35; width: 100%; height: 70px; padding-top: 40px; margin-bottom: 30px; display: inline-block; background: url('http://img11.hostingpics.net/pics/682400titre1.png') top center no-repeat #000000;}.titre2_demons{color: #5c221c; font-family: 'Cinzel', serif; font-weight: normal; font-size: 18px; text-align: center; text-shadow: 1px 1px 10px #5c504e; width: 100%; height: 40px; padding-top: 15px; display: inline-block; background: url('http://img15.hostingpics.net/pics/225898titre2.png') top center no-repeat #000000;}.titre3_demons{color: #9c2d1e; font-family: 'Calligraffitti', cursive; font-weight: normal; font-size: 18px; text-shadow: 0px 0px 2px #9c2d1e; text-align: left; padding-top: 15px; padding-left: 30px; display: inline-block;}.texte_demons{color: #71616b; font-size: 12px; padding-top: 5px; padding-left: 15px; padding-right: 15px; text-align: justify;}.credits_demons { font-family: 'Cinzel', serif; font-size: 8px; text-align: center; width: 100%; padding-top: 20px; } .credits_demons a { color: #71616b; text-decoration: none !important; transition: 100ms ease all; font-family: 'Cinzel', serif;} .credits_demons a:hover { color: #44120d; transition: 100ms ease all; }</style>


En cas de question ou de problème, je rappelle que la section problème avec mon code est là pour ça. Si vous me posez une question ici je risque de ne pas vous répondre !


Revenir en haut

La date/heure actuelle est Mer 22 Nov 2017 - 0:04