AccueilDernières imagesRechercherS'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.


3 résultats trouvés pour auteur_Fyraliel

Fyraliel

Fiche RP très basic - Lun 23 Mai 2016 - 19:43



Bonjour tout le monde,

Je viens vous proposer une fiche de rp simple et basic, sans image.
un petit screen de la fiche vous aidera à y voir plus clair Wink

Un petit merci fera apparaître le code Wink

Enjoy !

Code:
<style>.fleche_haut {margin: auto; width: 0;height: 0;border-left: 300px solid transparent;border-right: 300px solid transparent;border-bottom: 250px solid #64A8B2;}.titre_rp {width: 100%;text-align: center;font-family: 'Time New Roman'; font-size: 30px;position: absolute;top: -130px;}.fiche_corps{margin: auto; width: 596px;height: 500px;border: 2px solid #B2825A;background: #FFC79A;position: relative;}.cadre_rp {width: 80%;height: 395px;border: 1px solid #64A8B2;background: #FFD5B4;margin: 50px auto 0px auto;font-family: 'Time New Roman';font-size: 15px;text-align: justify;padding: 5px 5px 0;overflow: auto;}.fleche_bas{width: 0;height: 0;border-left: 300px solid transparent;border-right: 300px solid transparent;border-top: 250px solid #64A8B2;margin: auto;}</style>
<div class="fleche_haut"></div><div class="fiche_corps"><div class="titre_rp">titre du rp</div><div class="cadre_rp">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam tempus ullamcorper congue. Morbi in consequat erat. Integer ultrices turpis ut posuere ultricies. Vestibulum interdum turpis at placerat gravida. Sed vel pretium purus, et maximus augue. Proinornare nulla ac egestas mollis. Aenean viverra cursus dolor, nec euismod ex elementum ac. Suspendisse arcu magna, tincidunt vitae bibendum ac, ornare vel purus. Integer suscipit pulvinar sollicitudin. Phasellus id dignissim sem. Praesent dapibus nisi vel consectetur porttitor. Vestibulum gravida lorem et lacinia suscipit. Nam nisl massa, convallis sed enim ullamcorper, volutpat laoreet tellus. Ut eleifend ornare tellus, sed vestibulum lacus dictum laoreet. Donec sed facilisis ante. Ut tempor malesuada ipsum, eu posuere quam mollis quis.

Nulla sollicitudin malesuada dui, at rhoncus nisi ultrices vel. Nam lobortis ligula ac consectetur luctus. Cras nec quam nisl. Sed quis efficitur risus, id consectetur nunc. Nulla vel vulputate ligula. Praesent non est bibendum, eleifend magna vitae, consequat dui. Phasellus tempor ultricies lorem. Sed et dui ex. Fusce in volutpat eros. Vivamus viverra, turpis condimentum tincidunt mollis, velit mauris iaculis est, ac rutrum dui velit rhoncus ipsum. Praesent auctor est quis efficitur posuere. Aenean et purus neque. Morbi vitae dignissim lorem. Donec leo mauris, aliquet aliquet nisi id, commodo sollicitudin nunc. Maecenas risus enim, congue sed turpis ac, ultricies tincidunt magna. Aliquam a magna quis justo venenatis sodales. Pellentesque dolor sapien, elementum gravida magna sed, commodo placerat tortor. Duis a ante tristique, rutrum massa a, elementum magna. Mauris semper justo a ipsum malesuada efficitur. Pellentesque eget sapien porttitor, lacinia leo sed, tincidunt velit. Phasellus metus purus, tristique ac est a, elementum cursus massa. Maecenas ultricies condimentum varius. Pellentesque elementum feugiat risus, ac laoreet turpis feugiat eu. Nam porta at lectus vel auctor.

Curabitur id tempor turpis. Suspendisse luctus urna non felis dictum condimentum. Nunc sodales ultricies ipsum et hendrerit. Cras ultrices neque ac volutpat aliquet. Sed bibendum ante vel orci faucibus mollis. Integer a lorem sodales, cursus diam id, euismod ante. Donec enim est, ultrices sed est vel, auctor placerat turpis.
<a href="http://www.never-utopia.com/" style="width: 100%;color: #9AF1FF;font-size: 10px;position: absolute;bottom: -50px;right: -1px;display: block; text-align: center;">Fyraliel</a></div></div><div class="fleche_bas"></div>

Fyraliel

PA Clap de Film - Mer 4 Nov 2015 - 18:34



Coucou tout le monde ^^

Je vous propose une jolie PA en forme de clap de film suite à la demande de Nausicäa Kaer.
Voici un petit Screenshot pour vous montrer à quoi cela ressemble ^^

Merci de laisser le crédit surtout après avoir fait l'effort de le rendre discret ^^

Enjoy !


Pour pouvoir ajouter une PA à votre forum il faudra avant tout que vous soyez au moins admin du forum.

Le code qui suit est à mettre dans le panneau d'administration > onglet Affichage > colone de gauche Couleurs > onglet Feuille de Style CSS

Code:

.PA_totale {
    position: relative;
    height: 587px;
    width: 900px;
    padding-top: 100px;
    background: url(http://nsa37.casimages.com/img/2015/10/07/15100704212978660.png);
}
.PA_totale > a{
    position: absolute;
    top: 22px; left: 225px;
    color: #A9916F;
    -webkit-transform: rotate(48deg);
    transform: rotate(48deg);
    font-size: 11px;
}
.PA_totale *::-webkit-scrollbar-thumb {
    background: #5E4E39;
}
.PA_totale *::-webkit-scrollbar-track {
 background: #CCBDAB;
}
.PA_totale *::-webkit-scrollbar {
    width: 7px;
}
.cadre_contexte {
    height: 190px;
    width: 815px;
    margin: 35px auto 0;
    position: relative;
    font: 30px 'Kaushan Script';
    color: #CCBDAB;
    text-align: left;
}
.texte_contexte {
    position: absolute;
    height: 150px;
    width: 800px;
    top : 45px; left : 0;
    font: 15px 'Droid Serif';
    color: #DDD3C7;
    overflow: auto;
    text-align: justify;
    padding: 5px;
    -webkit-transition: 1s all;
    transition: 1s all;
}
#texte1{
    opacity: 1;
}
#texte2{
    opacity: 0;
}
#texte2:target{
    opacity: 1;
}
#texte2:target ~ #texte1{
    opacity: 0;
}
.tour_point {
    position: absolute;
    right: -10px;
    top: 50px;
}
.point {
    display: block;
    height: 6px;
    width: 6px;
    background: #CCBDAB;
    border-radius: 10px;
    margin-top: 40px;
}
.cadre_actu{
    height: 90px;
    width: 815px;
    margin: 20px auto 0;
    font: 30px 'Kaushan Script';
    color: #CCBDAB;
    text-align: left;
}
.texte_actu{
    height: 95px;
    width: 800px;
    font: 15px 'Droid Serif';
    margin-top: -5px;
    color: #DDD3C7;
    overflow: auto;
    text-align: justify;
    padding: 5px;
}
.cadre_staff{
    height: 65px;
    width: 790px;
    position: relative;
    top: 70px;
    font: 13px 'Droid Serif';
    color: #CCBDAB
}
.cadre_staff img{
    height: 60px;
    width: 60px;
    margin: 4px 0 0 10px;
}
.cadre_staff span{
    display: inline-block;
    vertical-align: middle;
    height: 60px;
}
.top_site{
    height: 90px;
    width: 235px;
    position: relative;
    top: 80px;
    display: inline-block;
}
.top_site img{
    height: 31px;
    width: 88px;
    margin: 8px 0 0 20px;
}
.musica{
    height: 85px;
    width: 265px;
    position: relative;
    top: 82px; left: 6px;
    display: inline-block;
}
.liens_utiles{
    height: 85px;
    width: 285px;
    position: relative;
    top: 82px;
    display: inline-block;
    text-align: center;
    font: 17px 'Droid Serif';
    overflow: auto;
}
.liens_utiles a{
    display: block;
}


Le code qui suite est à mettre dans le Panneau d'administration > onglet Affichage > colone de gauche Généralité

Code:
<link type="text/css" rel="stylesheet" href="https://fonts.googleapis.com/css?family=Droid+Serif|Kaushan+Script" />
<div class="PA_totale">
    <a href="http://www.never-utopia.com/"> (c) Fyraliel </a>    
 <div class="cadre_contexte">
 Contexte  
 <div id="texte2" class="texte_contexte">
 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam diam arcu, dictum ac dignissim sed, aliquam nec eros. Suspendisse potenti. Praesent ac nisl ac sapien imperdiet aliquam sit amet a mi. Aliquam sodales, nibh sed feugiat semper, mi dui maximus felis, vitae dapibus est dolor non lacus. Vivamus aliquam dui ac tortor ornare euismod. Aliquam sed facilisis est. Morbi id lectus ultrices enim rutrum laoreet. Proin eget lectus scelerisque, sollicitudin justo dapibus, tempus est. Mauris et neque porta, suscipit mi ac, semper tortor. Ut interdum vitae elit laoreet lobortis. Cras dictum mollis eleifend. Sed in elit vel ante semper venenatis sit amet a risus.
 </div>
        
 <div id="texte1" class="texte_contexte">
 Post hoc impie perpetratum quod in aliis quoque iam timebatur, tamquam licentia crudelitati indulta per suspicionum nebulas aestimati quidam noxii damnabantur. quorum pars necati, alii puniti bonorum multatione actique laribus suis extorres nullo sibi relicto praeter querelas et lacrimas, stipe conlaticia victitabant, et civili iustoque imperio ad voluntatem converso cruentam, claudebantur opulentae domus et clarae. Alii nullo quaerente vultus severitate adsimulata patrimonia sua in inmensum extollunt, cultorum ut puta feracium multiplicantes annuos fructus, quae a primo ad ultimum solem se abunde iactitant possidere, ignorantes profecto maiores suos, per quos ita magnitudo Romana porrigitur, non divitiis eluxisse sed per bella saevissima, nec opibus nec victu nec indumentorum vilitate gregariis militibus discrepantes opposita cuncta superasse virtute.
 </div>
        
 <div class="tour_point">
            <a href="#texte1">
 <span class="point">
 </span></a>            <a href="#texte2">
 <span class="point">
 </span></a> 
 </div>
    
 </div>
    
 <div class="cadre_actu">
 Actualité    
 <div class="texte_actu">
 Praesent consectetur nibh quis viverra facilisis. Proin ultricies, dolor mollis molestie accumsan, sapien tellus tincidunt erat, a efficitur nisl justo a metus. Aliquam tempor, est id condimentum commodo, nisl libero feugiat sem, in vehicula felis tortor a risus. Donec egestas lacinia augue vel elementum. Nam accumsan lectus quis arcu fermentum, in blandit risus dignissim. Donec in augue maximus, malesuada tortor ac, convallis orci. Morbi quis vulputate velit, vitae porta lorem. Vestibulum tristique erat eu lectus aliquet, hendrerit tristique sapien lobortis. Pellentesque viverra a quam vel suscipit.
 </div>
 </div>
    
 <div class="cadre_staff">
 <img src="http://ecx.images-amazon.com/images/I/41HvkfoCaRL._AC_SX60_CR,0,0,60,60_.jpg" /> <span>pseudo1</span>    <img src="https://i.vimeocdn.com/portrait/8284582_60x60.jpg" /> <span>pseudo2</span>    <img src="http://fr.web.img5.acsta.net/c_60_60/avatar/FR/1/4/5/Z20111208150552540635541/img/4rclfxgv.ve2.jpg" /> <span>pseudo3</span>    <img src="http://0.gravatar.com/avatar/fa1faaa25e9b175ec5c36991ff82ef1f?s=60&d=identicon&r=G" /> <span>pseudo4</span>        <img src="http://www.eteks.com/coursjava/images/ImageTableau.jpg" /> <span>pseudo5</span>        <img src="http://piglab.fr/site/imgcarre/tafs_0007_batgumfizz.jpg" /> <span>pseudo6</span>    
 </div>
    
 <div class="top_site">
 <a href="http://www.never-utopia.com/"><img src="http://img4.hostingpics.net/pics/213378miniban3.jpg" /></a>    <a href="http://www.never-utopia.com/"><img src="http://img4.hostingpics.net/pics/889072miniban11.gif" /></a>    <a href="http://www.never-utopia.com/"><img src="http://img11.hostingpics.net/pics/852212logo2.gif" /></a>    <a href="http://www.never-utopia.com/"><img src="http://img4.hostingpics.net/pics/120350miniban.jpg" /></a>
 </div>
    
 <div class="musica">
 <iframe style="width: 265px; height: 85px;" ;="" src="//www.youtube.com/embed/8zj-UWmPqzU" allowfullscreen="" frameborder="0">
 </iframe>
 </div>
    
 <div class="liens_utiles">
        <a href="#">Lien 1</a>        <a href="#">Lien 2</a>        <a href="#">Lien 3</a>        <a href="#">Lien 4</a>        <a href="#">Lien 5</a>        <a href="#">Lien 6</a>        <a href="#">Lien 7</a>        <a href="#">Lien 8</a>    
 </div>
</div>


Mettre un crédit vers Never-Utopia est obligatoire. Retirer un crédit est interdit.
Vos commentaires et remerciements sont toujours bienvenus ^^
Si vous avez des problèmes avec ce LS, venez poster ici.

Fyraliel

Fiche de pub tons marrons/beiges - Lun 14 Sep 2015 - 16:10



Bonjour tout le monde ^^
Suite à la demande d'Amychan voici le LS de la fiche Wink

Tout d'abord voici un petit screen pour que vous puissiez voir à quoi ça ressemble ^^

Et maintenant le code ^^
Code:
<link href='https://fonts.googleapis.com/css?family=Great+Vibes' rel='stylesheet' type='text/css' / /><div style="height: 650px; width: 500px; background: #C78A31; text-align: center;"><img src="http://i21.servimg.com/u/f21/15/03/21/91/banniy10.png" style="margin: 20px 0 0 20px;" /><div style="height: 25px; width: 250px; color: #371605; font-size: 50px; font-family: 'Great Vibes'; margin: 30px 0 0 115px; border-bottom: 1px solid #371605;">Contexte</div><div style="height: 187px; width: 430px; background: #FEFDA5; border: 2px dotted #371605; border-radius: 5px; overflow: auto; text-align: justify; padding: 3px 2px 0 3px; font-family: Time New roman; font-size: 15px; color: #371605; margin: 10px 0 0 35px;">Haec igitur Epicuri non probo, inquam. De cetero vellem equidem aut ipse doctrinis fuisset instructior est enim, quod tibi ita videri necesse est, non satis politus iis artibus, quas qui tenent, eruditi appellantur aut ne deterruisset alios a studiis. quamquam te quidem video minime esse deterritum. Oportunum est, ut arbitror, explanare nunc causam, quae ad exitium praecipitem Aginatium inpulit iam inde a priscis maioribus nobilem, ut locuta est pertinacior fama. nec enim super hoc ulla documentorum rata est fides. Haec et huius modi quaedam innumerabilia ultrix facinorum impiorum bonorumque praemiatrix aliquotiens operatur Adrastia atque utinam semper quam vocabulo duplici etiam Nemesim appellamus: ius quoddam sublime numinis efficacis, humanarum mentium opinione lunari circulo superpositum, vel ut definiunt alii, substantialis tutela generali potentia partilibus praesidens fatis, quam theologi veteres fingentes Iustitiae filiam ex abdita quadam aeternitate tradunt omnia despectare terrena.</div><div style="height: 25px; width: 200px; color: #371605; font-size: 50px; font-family: 'Great Vibes'; margin: 30px 0 0 145px; border-bottom: 1px solid #371605;">Statistiques</div><div style="height: 187px; width: 430px; background: #FEFDA5; border: 2px dotted #371605; border-radius: 5px; overflow: auto; text-align: justify; padding: 3px 2px 0 3px; font-family: Time New roman; font-size: 15px; color: #371605; margin: 15px 0 0 35px;">Haec igitur Epicuri non probo, inquam. De cetero vellem equidem aut ipse doctrinis fuisset instructior est enim, quod tibi ita videri necesse est, non satis politus iis artibus, quas qui tenent, eruditi appellantur aut ne deterruisset alios a studiis. quamquam te quidem video minime esse deterritum. Oportunum est, ut arbitror, explanare nunc causam, quae ad exitium praecipitem Aginatium inpulit iam inde a priscis maioribus nobilem, ut locuta est pertinacior fama. nec enim super hoc ulla documentorum rata est fides. Haec et huius modi quaedam innumerabilia ultrix facinorum impiorum bonorumque praemiatrix aliquotiens operatur Adrastia atque utinam semper quam vocabulo duplici etiam Nemesim appellamus: ius quoddam sublime numinis efficacis, humanarum mentium opinione lunari circulo superpositum, vel ut definiunt alii, substantialis tutela generali potentia partilibus praesidens fatis, quam theologi veteres fingentes Iustitiae filiam ex abdita quadam aeternitate tradunt omnia despectare terrena.</div><a href="http://www.never-utopia.com/">Fyraliel</a></div>



Enjoy !


Revenir en haut

La date/heure actuelle est Ven 29 Mar 2024 - 7:12