AccueilAccueil  CalendrierCalendrier  FAQFAQ  StaffStaff  RechercherRechercher  S'enregistrerS'enregistrer  MembresMembres  ConnexionConnexion  

Partagez | 
 

 AjonesA CSS

Aller en bas 
AuteurMessage
Invité
Invité



MessageSujet: AjonesA CSS   Lun 14 Jan 2008 - 20:05

Bon, vu que c'est un peu ma faute si cette nouvelle section viens d'ouvrir, ça la foutrait mal si j'y participais pô...

Donc voilà,j'inogure, je partage mon CSS de journal dévellopé en grande partie par sedART qui m'as aidé à l'optimiser pour cette daube de Ie...

Vous pouvez voir mon journal en action ICI

Et voici le code...

Le Header
Code:
<div class="fire">:thumb63311150:</div>
<div class="buttonscontainer"><div class="buttons"><a href="http://creatures.redheberg.com/">Creatures' Website</a><a href="http://creatures.redheberg.com/index.php?option=com_smf&Itemid=2&board=14.0">Tutorials (Fr)</a><a href="http://creatures.redheberg.com/index.php?option=com_smf&Itemid=2&board=50.0">Gallery</a><a href="http://creatures.redheberg.com/index.php?option=com_smf&Itemid=2&board=54.0">Photomanip</a><a href="http://creatures.redheberg.com/index.php?option=com_smf&Itemid=2&board=23.0">HP Lovecraft</a><a href="http://ajonesa.deviantart.com/prints/">Prints</a></div></div>


Journal Entry
Code:
<div align="right"><div class="header3"><b>:flame: SedART helped me!</b></div><b>I very happy for my new journal
now 'cause it's compatible with Ie...
Good news, sedART helped me  :bulletred:</b>
:postit: <u>All artworks are protected</u> :postit:
<i>under Creative Commons !
You can't use my art for make money
and you can't modify them except if
you ask me the rights
by mail or note... (aJa)</i>


<a href="http://sedart.deviantart.com/"><img src="http://creatures.de.legende.free.fr/EXTRA/DAJournal/thxsedart.gif" alt=""></a>

:thumb61440544: :thumb61484067:           

<a href="http://creatures.redheberg.com/index.php?option=com_smf&Itemid=2&board=50.0" target="_blank"><img src="http://creatures.de.legende.free.fr/EXTRA/DAJournal/catalog_01.gif" alt="" width="200" height="80" border="0"></a>
<a href="http://creatures.redheberg.com/index.php?option=com_smf&Itemid=2&board=38.0" target="_blank"><img src="http://creatures.de.legende.free.fr/EXTRA/DAJournal/catalog_02.gif" alt="" width="200" height="25" border="0"></a>
<a href="http://creatures.redheberg.com/index.php?option=com_smf&Itemid=2&board=39.0" target="_blank"><img src="http://creatures.de.legende.free.fr/EXTRA/DAJournal/catalog_03.gif" alt="" width="200" height="25" border="0"></a>
<a href="http://creatures.redheberg.com/index.php?option=com_smf&Itemid=2&board=40.0" target="_blank"><img src="http://creatures.de.legende.free.fr/EXTRA/DAJournal/catalog_04.gif" alt="" width="200" height="25" border="0"></a>
<a href="http://creatures.redheberg.com/index.php?option=com_smf&Itemid=2&board=44.0" target="_blank"><img src="http://creatures.de.legende.free.fr/EXTRA/DAJournal/catalog_05.gif" alt="" width="200" height="25" border="0"></a>
<a href="http://creatures.redheberg.com/index.php?option=com_smf&Itemid=2&board=46.0" target="_blank"><img src="http://creatures.de.legende.free.fr/EXTRA/DAJournal/catalog_06.gif" alt="" width="200" height="25" border="0"></a>
<a href="http://creatures.redheberg.com/index.php?option=com_smf&Itemid=2&board=43.0" target="_blank"><img src="http://creatures.de.legende.free.fr/EXTRA/DAJournal/catalog_07.gif" alt="" width="200" height="25" border="0"></a>
<a href="http://creatures.redheberg.com/index.php?option=com_smf&Itemid=2&board=42.0" target="_blank"><img src="http://creatures.de.legende.free.fr/EXTRA/DAJournal/catalog_08.gif" alt="" width="200" height="25" border="0"></a>
<a href="http://creatures.redheberg.com/index.php?option=com_smf&Itemid=2&board=50.0" target="_blank"><img src="http://creatures.de.legende.free.fr/EXTRA/DAJournal/catalog_09.gif" alt="" width="200" height="25" border="0"></a>
<img src="http://creatures.de.legende.free.fr/EXTRA/DAJournal/catalog_12.gif" width="200" height="20" alt=""></div>
<a href="http://creatures.redheberg.com/index.php?option=com_smf&Itemid=2&action=gallery" target="_blank"><img src="http://creatures.de.legende.free.fr/EXTRA/DAJournal/stock.gif" alt="" border="0"></a>
<a href="http://creatures.redheberg.com/index.php?option=com_smf&Itemid=2&action=shop" target="_blank"><img src="http://creatures.de.legende.free.fr/EXTRA/DAJournal/mag.gif" alt="" border="0"></a></div>

<div align="right">
<img src="http://creatures.de.legende.free.fr/EXTRA/DAJournal/dd.gif" alt=""></div>
<div class="wow3">:thumb28902749: :thumb58843398:</div>
<div align="right"><img src="http://creatures.de.legende.free.fr/EXTRA/DAJournal/feat.gif" alt=""></div>
<div class="wow3">:thumb59377286: :thumb50048972: :thumb43384351:
:thumb38648871: :thumb50467137: :thumb49765161:
:thumb47866382: :thumb37202345: :thumb54540459:</div>
<div class="wow4"><i>(Scroll with the mouse to show all stamps)</i></div><div class="textsx">
<img src="http://creatures.de.legende.free.fr/EXTRA/DAJournal/titlebottom_stamps.jpg" alt="">
:thumb62712996: :thumb62761941: :thumb62761828: :thumb62761764:
<img src="http://creatures.de.legende.free.fr/EXTRA/DAJournal/titlebottom_art.jpg" alt="">
:thumb62762201: :thumb62762303: :thumb62762507: :thumb62762668:
:thumb62762795: :thumb62762951: :thumb62806423: :thumb62806621:
:thumb62806765: :thumb62806909: :thumb62807116: :thumb62807350:
:thumb62807504: :thumb62807649: :thumb62807768: :thumb62808037:
:thumb62808177: :thumb62808299: :thumb62808441:
<img src="http://creatures.de.legende.free.fr/EXTRA/DAJournal/titlebottom_fr_stamp.jpg" alt="">
:thumb62711949: :thumb62712906: :thumb62712399: :thumb62711803:
:thumb62712741: :thumb62712093: :thumb62712586: :thumb62712488:
:thumb62761656: :thumb62761548: :thumb62761356:</div>


Footer
Code:
<div align="right"><img src="http://creatures.de.legende.free.fr/EXTRA/DAJournal/visit.gif" alt=""></div>
<div class="wow3">
<a href="http://www.maploco.com/view.php?id=1052317">...</a>
<img border=0 src="http://www.maploco.com/vmap/1052317.png" alt="Visitor Map"></div>

<div class="headerx">:thumb56379363: :thumb35922224: :thumb55558773:
:thumb21400109: :thumb60411254: :thumb62762025:
:thumb50984278: :thumb43460142: :thumb46086808:
:thumb57426575: :thumb39816247: :thumb46425382:
:thumb36696425: :thumb62300749: :thumb60943018:

" ThX a lot for all CSS tuts by :devsedart: "</div>

et enfin...

Le CSS
Code:
div.journalbox {
    background-color:#bac5ba !important;
    border: 0px solid #000000;
    background-image:url(http://creatures.de.legende.free.fr/EXTRA/DAJournal/backgroundDAJ18.jpg);
    cursor:url(http://creatures.de.legende.free.fr/EXTRA/DAJournal/cursors/aja001.cur),auto;
    background-repeat:no-repeat;
    background-position:left top;
        color:#fff;
    margin-right: -34px;
}
div.journalbox a {
    cursor:url(http://creatures.de.legende.free.fr/EXTRA/DAJournal/cursors/aja002.cur),auto;
    color:#ffcc00;
    text-decoration:none;
}
div.journalbox a:hover {
    text-decoration:none;
    font-weight:none;
    color:#fff;
}

div.buttonscontainer {
                position:absolute;
                left:0px;
                top:101px;
}
div.buttons {
    background: transparent;
    padding-top: 5px;
    padding-bottom: 5px;
                text-decoration: none;
    color: #fff;
}
div.buttons a {
    color: #ffcc00;
                background-image:url(http://creatures.de.legende.free.fr/EXTRA/DAJournal/backbutDAJ.jpg);
    background-repeat:repeat-x;
    background-position:left top;
    border-top: 0px solid #000000;
    padding: 5px;
    padding-left: 5px;
    font: 11px Verdana;
    font-weight: none;
    text-decoration: none !important;
    text-align: center;
    margin-top: 0px;
}
div.buttons a:hover {
    background: transparent;
    padding-top: -4px;
        text-decoration: none;
    color: #fff;
}
div.text {
    color:#fff !important;
    text-align: justify;
    font-size: 8pt !important;
    font-family:Verdana;
    line-height:15px;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px !important;
}
div.journaltop {
    padding:0px 0px 0px 200px;
    font-family:Verdana;
    font-size:7pt;
    color:#fff;
    height:0px;
    background-color: transparent;
    text-align: left;
    line-height: 20px;
                margin-bottom:0px;
    height: 90px;
}
div.journaltop h2 {
    padding:2px 0px 0px 0px;
                margin-top:0px;
    font-family:Arial Black;
    font-size:15pt;
    font-weight: lighter;
    color:#fff;
    letter-spacing:0.0em;
    text-align: left;
    line-height: 20px;
}
div.fire {
  position:absolute;
  top:35px;
  right:0px;
}
div.journaltop img {
    display:none;
}

div.text {
    color:#000 !important;
    text-align: justify;
    font-size:8pt !important;
    font-family:Verdana;
    line-height:12px;
    margin-left: 30px;
    margin-right: 30px;
    overflow: no;
}
div.textsc {
    color: #fff !important;
    letter-spacing:-0.03em;
    text-align: right;
    font-size:14px !important;
    font-family:Verdana;
    line-height:8px;
    margin-left: 30px;
    margin-right: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
    width: none;
    height: 100px;
    overflow: auto;
}
div.textsx {
    color:#333333 !important;
    background-color:transparent !important;
    font-size:8pt !important;
    font-family:Arial;
    text-align: center;
    line-height:15px;
    width: none;
    height: 175px !important;
    overflow: auto;
        padding-right: 100px;
    margin-right: -215px;
        padding-left: 100px;
    margin-left: -215px;
    margin-top: 0px !important;
    border: 4px solid #374341;
}
div.quote {
        width : 250px;
    font-size:8pt !important;
    font-family:Verdana;
    color:#fff;
    line-height:15px;
    text-align: right;
    margin-right: 4px;
    margin-left: 130px;
    border: 2px solid #ffcc00;
    padding:4px 4px 4px 4px;
    background: #374341;
}
div.header {
    background: #92a399;
    font-size: 14pt !important;
    font-family:Verdana;
    color: #444844 ;
    margin-left: 30px;
    margin-right: 30px;
    padding-top: 10px;
    padding-bottom: 10px;
    text-align: center;
    word-spacing: 5px;
}
div.header2 {
    color:#359BD2 !important;
    font-size: 14pt !important;
    font-family:Arial;
    padding:6px !important;
    border: 0px solid #000000;
    margin:1em !important;
    word-spacing: 5px;
    text-align: center;
    margin-left: 30px;
    margin-right: 30px;
}
div.header3 {
    color:#fff !important;
    font-size: 11pt !important;
    font-family:Verdana;
}
div.headerx {
    color:#6a7872 !important;
    font-size:9px !important;
    font-family:Verdana;
    padding:0px !important;
    border: 0px solid #000000;
    margin:none !important;
    text-align: center;
    text-decoration: none;
    margin-left: 30px;
    margin-right: 30px;
}
div.journalbottom {
    clear:both;
    background-color:transparent;
    background:url(http://creatures.de.legende.free.fr/EXTRA/DAJournal/backfooterDAJ2.jpg) no-repeat bottom center;
    height: 75px !important;
    font-family:Verdana;
    font-size:10px;
    color:#ffcc00;
}
div.journalbottom a {
    color:#fff;
    text-decoration:none;
}
div.journalbottom a:hover {
    text-decoration:none;
    font-weight:none;
    color:#ffcc00;
}
div.journalbox ul.list {
    padding: 0px 0px 0px 0;
    font-family:Tahoma;
    font-size:10px;
    color:#333333;
    letter-spacing:0.10em;
    line-height:5px;
    background-color:transparent;
}
div.journalbox ul.list img {
    display:none;
}
div.journalbox ul.list li.a {
    background-color:transparent;
}

div.wow2 {
    background-color: #444844;
    font-size: 10pt !important;
    font-family:Verdana;
    color: #fff ;
    margin-left: 0px;
    margin-right: 0px;
    padding-top: 8px;
    padding-bottom: 8px;
    text-align: center;
    word-spacing: 5px;
    overflow: none;
}

div.wow3 {
    background-image:url(http://creatures.de.legende.free.fr/EXTRA/DAJournal/backbloc.gif) !important;
    background-repeat:no-repeat;
    background-position:left top;
    font-size: 10pt !important;
    font-family:Verdana;
    color: #fff ;
    margin-left: 0px;
    margin-right: 0px;
    padding-top: 8px;
    padding-bottom: 8px;
    text-align: center;
    word-spacing: 5px;
    overflow: none;
}
div.wow4 {
    background-image:url(http://creatures.de.legende.free.fr/EXTRA/DAJournal/backbloc.gif) !important;
    background-repeat:no-repeat;
    background-position:left top;
    font-size: 7pt !important;
    font-family:Verdana;
    text-align: right;
    color: #bbc2bb ;
    margin-left: 0px;
    margin-right: -4px;
    padding-right: 8px;
    padding-top: 4px;
    padding-bottom: 4px;
    word-spacing: 5px;
    overflow: none;
}

J'ai laissé les URL mais biensur, pensé à les virer ;)
Si vous avez des questions n'hésitez pas...
Revenir en haut Aller en bas
Invité
Invité



MessageSujet: Re: AjonesA CSS   Lun 14 Jan 2008 - 20:30

*triste* moi j'ai pas de question.. je vais juste me mettre la tête dans le four et allumer le gaz...
Revenir en haut Aller en bas
fleet
VIP
avatar

Masculin Nombre de messages : 552
Age : 29
Localisation : Bordeaux
Date d'inscription : 06/12/2006

MessageSujet: Re: AjonesA CSS   Lun 14 Jan 2008 - 20:39

Ahaha, c'est parce que tu t'y connais pas en codage, c'est normal, mais c'est bien plus simple a faire avec des editeurs :)
Revenir en haut Aller en bas
Voir le profil de l'utilisateur http://jo0o.deviantart.com
Invité
Invité



MessageSujet: Re: AjonesA CSS   Mar 15 Jan 2008 - 0:44

Jo a écrit:
Ahaha, c'est parce que tu t'y connais pas en codage, c'est normal, mais c'est bien plus simple a faire avec des editeurs :)
ah ben oui, c'est déjà vachement plus clair, merci Jo!*eek!*
Revenir en haut Aller en bas
Invité
Invité



MessageSujet: Re: AjonesA CSS   Mar 19 Fév 2008 - 19:54

Même si j'ai quelques notions plus que basique en codage.... Voir tout ça me donne mal au crâne XD

De toutes façons je suppose qu'il faut avoir souscris à DA ?
Revenir en haut Aller en bas
Invité
Invité



MessageSujet: Re: AjonesA CSS   Dim 13 Avr 2008 - 14:16

Exact, faut souscrire pour pouvoir égayer les journaux d'un peu de CSS...
Revenir en haut Aller en bas
Invité
Invité



MessageSujet: Re: AjonesA CSS   Ven 2 Sep 2011 - 17:12

On sait injecter du code Javascript ladedans ?
Revenir en haut Aller en bas
Contenu sponsorisé




MessageSujet: Re: AjonesA CSS   

Revenir en haut Aller en bas
 
AjonesA CSS
Revenir en haut 
Page 1 sur 1
 Sujets similaires
-
» AjonesA CSS

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
Forum Francophone deviantART :: Deviant ART :: CSS-
Sauter vers: