Seite 1 von 2

Simplel & Funktional - Style

Verfasst: 1. Mär 2007, 12:55
von MadP
Hi,

habe mir nen Style aus Standardstyles zusammengebastelt, weil mir der Defaultstyle zu platzverschwänderisch war und der Mittelalter-Style zu blaue links hatte ;)
Deswegen habe ich das beste aus beiden verwendet, und präsentiere hier den Style, der auf den erstem Blick vielleicht kaum auffällt, aber im Detail meinem Ideal recht nahe kommt.

Hier einScreenshot

Aus Solidarität habe ich den fw-Werbebanner beibehalten. Wer nicht damit leben kann, ändert dies unter '.framebannerbg '

Da ich leider keinen guten, schnellen Webspace habe, der viel Traffic verträgt, poste ich den code hier. also einfach kopieren, in ne .css-Datei einfügen, hochladen (oder für IE nutzer lokal abspeicher) und ab dafür!

Code: Alles auswählen

/* global */
p,ul,ol,div,td,span,
layer,table,body	 { color: #222222; font-size: 12px; font-family: Arial, Verdana }
p 					{ margin: 0px; padding: 0px; }

/* body */
body 				{ background-color: #ffffff; margin: 0px; }

/* table */
table 				{ border:0px; border-collapse: collapse; } /* cellspacing & cellpadding & border =0 no longer needed
td 					{ padding:0px; margin:0px; }

/* scrollbars */
/* body, textarea 		{ scrollbar-base-color:#BBBBBB; scrollbar-3dlight-color:#FFFFFF; scrollbar-arrow-color:#007F9F; scrollbar-darkshadow-color:#999999; scrollbar-face-color:#D5D5D5; scrollbar-highlight-color:#FFFFFF; scrollbar-shadow-color:#636363; scrollbar-track-color:#F5F5F5; } */

/* links */
a:link { color:#BB3300; text-decoration:none; font-weight:bold; }
a:visited { color:#BB3300; text-decoration:none; font-weight:bold; }
a:active { color:#DD4400; text-decoration:hover; font-weight:bold; }
a:hover  { color:#DD0000; text-decoration:underline; font-weight:bold; }

/* fonts */
h1 { font-size:12px; font-weight:bold; margin-bottom: 0px;}
.medium { font-size:11px; }
.small { font-size:10px; }

/* colors */
.fontcolor { color: #555555; }
.white { color: #ffffff; }

/* bgcolors */
.body { background-color: #FFFFFF; }
.divider { background-color: #555555; }
.outline { background-color: #999999; }
.menubg	{ background-color: #F1F1F1; }

.brightbg	{ background-color: #E5E5E5; }
.verybrightbg	{ background-color: #F1F1F1; }
.reallybrightbg	{ background-color: #FAFAFA; }


.whitebg { background-color: #FFFFFF; }
.blackbg { background-color: #000000; }
.brownbg { background-color: #E1D8D1; }

/* forms */
.registerinput { width: 100%; font-size: 10px; }
.registersubmit { font-size: 10px; }
.logininput { width: 100%; font-size: 10px; }
.loginsubmit { width: 100%; font-size: 10px; }

/* forms */
.input 				  { font-size: 10px; background-color: #fbefef; border: solid 1px navy }
.submitsagen 		{ font-size: 10px; font-weight: bold; color: #000000; width: 88px; margin-left: 1px; margin-right: 2px; }
.submitschreien 	{ font-size: 10px; font-weight: bold; color: #004DA7; width: 88px; margin-right: 2px; }
.submitclan 		{ font-size: 10px; font-weight: bold; color: #CD3700; width: 88px; margin-right: 2px; }
.submitgroup		{ font-size: 10px; font-weight: bold; color: #CD8500; width: 88px; margin-right: 2px; }
.submitworldsay 	{ font-size: 10px; font-weight: bold; color: #000000; width: 88px; margin-right: 2px; }

textarea			 { font-size: 12px; background-color: transparent; border: solid 1px navy }
select 				{ font-size: 11px; background-color: #e8e9ff; }


/* banner stuff */
.bannerad { border: 1px solid #C85424; }



/* text classes */
.chattext   { color: #000000; font-size: 12px; font-family: Arial }
.chattextscream  { color: #004da7; font-size: 12px; font-family: Arial }
.chattextclan  { color: #CD3700; font-size: 12px; font-family: Arial }
.chattextgroup  { color: #CD8500; font-size: 12px; font-family: Arial }
.chattextinfo   { color: black; font-size: 12px; font-family: Arial; font-style: italic; background-color: #DEB887 }
.chattextworldsay  { color: #000000; font-family: Verdana; background-color: #C1CEF9 font-size: 13px }
.healthmed { color: #FF8000; }
.healthok { color: #309000; }
.healthcritical { color: #D20000; }
.chatpics { display: none }
.submitwhisper { font-size: 10px; font-weight: bold; color: #006600; width: 88px; margin-left: 1px; margin-right: 2px; }
.chattextwhisper { color: #006600; font-size: 12px; font-family: Verdana }

/* frames bg */
.framebannerbg { background-color: #C85424; background-image: url(http://213.239.212.176/freewar/images/bannerbg.jpg); border-bottom: 1px solid #000000; }
.framechatformbg   { background-image: url(http://213.239.212.176/freewar/images/button_bg.jpg) }
.framechattextbg { background-color: #F8F8F8; margin: 10px; margin-top: 5px; margin-bottom: 5px; margin-right: 5px; }
.framemainbg    { background-image: url(http://213.239.212.176/freewar/images/mainbg.jpg); background-repeat: repeat-y; background-position: right 50%; margin: 10px }
.frameitembg   { background-color: #dcdcdc; background-image: url(http://213.239.212.176/freewar/images/itembg.jpg); margin: 10px }
.framemapbg   { background-color: #c1bdba; background-image: url(http://213.239.212.176/freewar/images/itembg.jpg); margin: 3px 10px 10px }
.framemenubg   { background-color: #c1bdba; background-image: url(http://213.239.212.176/freewar/images/itembg.jpg) }

/* main module */
td.mainheader       { color: 050505; font-size: 26px; font-family: Arial; background-image: url(http://88.198.19.230/freewar/images/mittelalter1.jpg); height: 50px; border-bottom: 1px solid #999999 }
table.areadescription  { background-color: #ffffff; width: 100%; border: solid 1px #999999 }
td.areadescription    { background-image: url(http://88.198.19.230/freewar/images/mittelalter2.jpg); background-repeat: no-repeat; padding: 5px }
.imageborder { border: 1px solid #999999; background-color: #C85424; margin-right: 10px; margin-bottom: 0px;}
p.maincaption      { color: black; font-size: 20px; font-family: Verdana; background-image: url(http://88.198.19.230/freewar/images/mittelalter1.jpg); background-repeat: repeat-y; background-position: left top; padding: 2px 2px 2px 5px }
p.maincaption2    { font-size: 12px; font-weight: bold; background-color: #EAEAEF; background-image: url(http://213.239.212.176/freewar/images/bluebg.jpg); background-repeat: repeat; padding: 2px 2px 2px 5px }
p.maindesc1 { padding: 2px; padding-left: 5px; background-color: #FFF8EF; border: 1px solid #D6CBC2; border-top: 1px; width: 300px; }
p.maindesc2 { border: 1px solid #FFEAC9; background-color: #FFF8EF; width: 100%; }
p.listusersrow    { background-color: #F9F5FF; padding: 1px 1px 1px 5px; border-style: none solid solid; border-width: 0; border-color: #d6cbc2 }
p.listplaceitemsrow  { background-color: #F8F5FF; padding: 1px 1px 1px 5px; border-style: none solid solid; border-width: 0; border-color:  #d6cbc2 #d6cbc2 }

/* item module */
p.listcaption   { font-weight: bold; background-image: url(http://213.239.212.176/freewar/images/button_bg.jpg); padding: 1px 1px 1px 3px; border: solid 1px #a2a09f }
p.listsubcaption { border-bottom: 1px solid #D6CBC2; }
p.listrow  { background-color: #ece9e6; padding: 1px 1px 1px 3px; border-style: none solid solid; border-width: 1; border-color:  #d6cbc2 #d6cbc2 }
p.listitemrow   { background-color: #ece9e6; background-image: url(); margin-bottom: 2px; padding: 1px 1px 1px 3px; border: solid 1px #d6cbc2 }
p.listmainrow  { background-color: #ece9e6; padding: 2px 2px 2px 5px; bottom: 50px; border-style: none solid solid; border-width: 0 1px 1px; border-color:  #d6cbc2 #d6cbc2 }
.valueincreased { font-weight: bold; color: #CD3700; } 
.itemamount { font-weight: bold; color: #751700; }
.itemequipped { font-weight: bold; color: #CD3700; }
.itemmagic { font-weight: bold; color: #008800; }
.iteminventorypics { display: none }

/* map module */
p.positiontext    { color: #000000; font-size: 10px; background-color: #bbbbbb; background-image: url(http://213.239.212.176/freewar/images/button_bg.jpg); margin-right: 3; margin-bottom: 3px; margin-left: 0; padding-right: 0; padding-left: 0; width: 100%; border: solid 1px #a2a09f }

/* main module */
p.personlistcaption    { font-weight: bold; background-image: url(http://213.239.212.176/freewar/images/buttonblue_bg.jpg); padding: 1px 1px 1px 4px; border: solid 1px #a2a09f }
p.itemlistcaption    { font-weight: bold; background-image: url(http://213.239.212.176/freewar/images/buttonorange_bg.jpg); padding: 1px 1px 1px 4px; border: solid 1px #a2a09f }


/* misc */
.borderbg { background-color: #D0CFCF; }


Gruß

Verfasst: 1. Mär 2007, 14:49
von Mheatus
Mozilla User können auch Styles von der Festplatte aus nutzen *g*
Ansonsten gefällt mir der Style sogar ziemlich gut.. :D

Verfasst: 3. Mär 2007, 16:18
von Infinity
Ähm, könnte bitte mal jemand die .css datei für mich uploaden und hier reinstellen :D :?:

Verfasst: 3. Mär 2007, 16:28
von Irrlicht
Ist das Vista? *gg*

Verfasst: 3. Mär 2007, 16:57
von Mheatus
Man sieht doch, dass das kein Vista ist!? O.o

Verfasst: 3. Mär 2007, 17:29
von Infinity
Mheatus hat geschrieben:Man sieht doch, dass das kein Vista ist!? O.o
Das ist Vista. Das erkennt man unten rechts an der Taskleiste :wink:

Verfasst: 3. Mär 2007, 18:39
von Mheatus
Meiner Meinung nach ist es XP mit Vista Style.
Vista hat einen anderen Startbutton, andere Buttons für offene Applikationen und vor allem einen anderen (<) Knopf zum Zeigen mehrerer System-Tray-Icons.

Zu dem haben die Fenster einen anderen Menübalken und andere (_) (oO] (X) Balken...

Aber mal schauen was MadP sagt :D

Verfasst: 3. Mär 2007, 21:30
von Infinity
Aber auch egal >.< Ich hötte lieva mal meine .css Datei :cry:

Verfasst: 6. Mär 2007, 01:13
von MadP
Ne, das ist XP mit nem dunklen Theme.. Aber das ist ja nicht der Betriebssystems-Thread hier ;)
Gargoyle hat geschrieben:Aber auch egal >.< Ich hötte lieva mal meine .css Datei :cry:
nen css kannste dir fix selber basteln:
einfach nen neues Textdokument erstellen, in 'style.css' umbenennen, und den geposteten code kopieren und einfügen - fertig


Gruß

Verfasst: 6. Mär 2007, 12:57
von AngelOfDark
http://mitglied.lycos.de/xangelofdarkx/ ... tional.css

mal guggn wie lange der kostenlose Lycos-Account meine Styleaktivitäten noch mitmacht *hehe* hab da auch leider keine Trafficstatistiken, würde mich durchaus mal interessieren ;-)

Verfasst: 6. Mär 2007, 13:25
von Infinity
Aso, Thx an beide :D

Verfasst: 6. Mär 2007, 13:41
von Gilai
AngelOfDark hat geschrieben:http://mitglied.lycos.de/xangelofdarkx/ ... tional.css

mal guggn wie lange der kostenlose Lycos-Account meine Styleaktivitäten noch mitmacht *hehe* hab da auch leider keine Trafficstatistiken, würde mich durchaus mal interessieren ;-)
auf funpic kannste das auch gut machen^^

da liegt bisher zwar nur einer meiner styles... aber etliche profilbilder^^
und mim funzilla kannste die auch sehr bequem hochladen

Verfasst: 10. Mär 2007, 21:37
von MadP
AngelOfDark hat geschrieben:http://mitglied.lycos.de/xangelofdarkx/ ... tional.css

mal guggn wie lange der kostenlose Lycos-Account meine Styleaktivitäten noch mitmacht *hehe* hab da auch leider keine Trafficstatistiken, würde mich durchaus mal interessieren ;-)

Ah jo vielen Dank Angel!

Verfasst: 10. Mär 2007, 22:25
von AngelOfDark
passt scho ;-)

muss mir mal was für die Lycos-Seite einfallen lassen, bis jetzt klappt ja alles *breitgrinz*

ich könnte die ganzen Styles auch über meine kostenpflichtige Sache laufen lassen, aber ich hab absolut keine Ahnung, was da an Traffic rübergeht und Fan von Überraschungen bin ich auch nicht -.-

Verfasst: 10. Mär 2007, 23:30
von Maverick123
Finde den Style sehr schön und übersichtlich, weiter so!