CSS / stylesheet erstellen für Ilch?

CrazyRika · 02.02.2010

Hallo Leute
ich hab folgendes Problem..

Ich bin grade dabei mit Dreamweaver MX ein Design für Ilch zu erstellen.
Index zu machen und das Design dazu überhaupt kein Problem.
Nur mit dem CSS Coden komm ich nicht klar.
Hab mir schon mehrere Templates angeschaut aber die CSS is ja bei jedem anders.
Ich such schon überall Hilfe (Tutorial/etc.) aber nichts gefunden.
CSS 4 You - The Finest in Stylesheets hab ich auch schon versucht nur mein Problem liegt darin,
ich weiss nicht was ich alles für mein Design brauch, was wichtig dafür ist.
Kann mir jemand vielleicht Helfen?
Wenns geht sogar nen Tutorial oder ne Seite wo das wichtigste erklärt ist.
Wie sowas hier:

Danke schonmal für Antworten
Ich verzweifel echt schon und bin darin total der ''noob''

HansHansa · 03.02.2010

AW: CSS / stylesheet erstellen für Ilch?

Hallo,

Woher sollen es dann die anderen wissen, wenn Du nicht es nicht weißt.
Was genau willst Du denn machen?
Bei mir ändert es sich jeder Internetseite die ich erstelle.

Linktipp:
SELFHTML: Stylesheets (CSS)

CrazyRika · 03.02.2010

AW: CSS / stylesheet erstellen für Ilch?

Ich will mit Hilfe von Dreamweaver eine HP erstellen die über ilch läuft..
vielleicht gibt es ja 1 - 2 leute hier die wissen was grundsätzlich immer in so ner css für ilch rein kommen ;o

sowas mein ich z.b. :eek:

esupanetz · 03.02.2010

AW: CSS / stylesheet erstellen für Ilch?

Hi CrazyRika,

wieso sollte Ilch etwas besonderes in der CSS verlangen?
CSS ist doch schlicht und einfach eine Datei die diverse Formatvorlagen enthält, die du dann in den HTML-Dateien anwendest .........

lG

Eva

Tattoomaus78 · 03.02.2010

AW: CSS / stylesheet erstellen für Ilch?

CrazyRika schrieb:
.... was grundsätzlich immer in so ner css für ilch rein kommen ;o

auch nix anderes wie in jede andere CSS, das hat mit dem gewählten CMS nix zu tun...

grundsätzlich: :uhm:

body
#wrapper
#header
#navigation
#subnavigation
#content
#leftcontent
#middlecontent
#rightcontent
#footer
h1, h2, h3, h4.....
a:link, a:visited, a:active, a:hover
ul, li
p
.
.
.
usw

aber ob das dir jetzt weiterhilft wage ich zu bezweifeln...

befasse dich einfach mit einschlägiger Literatur und oder Webseiten/Tutorials. Vielleicht ganz hilfreich sich auch mal die CSS der ilch-demoseite anzusehen...

Code:

body {
background-color:#4A4849;
font-family:Verdana,sans-serif;
font-size:12px;
margin:0;
padding:0;
text-align:center;
}
#wrap {
margin:0 auto;
position:relative;
text-align:left;
width:967px;
}
#top {
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:transparent url(img/top.gif) repeat scroll 0 0;
height:67px;
}
#header {
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:transparent url(img/logo.gif) repeat scroll 0 0;
height:153px;
text-align:center;
vertical-align:middle;
}
#header h1 {
color:#FFFFFF;
display:inline;
font-family:'Trebuchet MS';
font-size:24px;
font-weight:normal;
left:100px;
position:absolute;
top:110px;
}
#top2 {
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:transparent url(img/top2.gif) repeat scroll 0 0;
height:31px;
}
#top2 font {
display:inline;
font-size:10px;
left:172px;
margin-top:2px;
position:absolute;
text-decoration:none;
}
#content {
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:transparent url(img/contentbg.gif) repeat scroll 0 0;
width:964px;
}
#footer {
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:transparent url(img/footer.gif) repeat scroll 0 0;
height:33px;
text-align:center;
vertical-align:middle;
}
#left_col {
color:#FFFFFF;
float:left;
overflow:hidden;
padding:0 18px 0 9px;
width:158px;
}
#left_col .Cmite, #left_col .Cnorm, #left_col .Cdark {
color:#000000;
}
#left_col a {
color:#CCCCCC;
}
#left_col .menu_heading {
color:#000000;
display:block;
font-size:11px;
letter-spacing:1px;
padding:0 0 3px 5px;
}
#main_col {
clear:none;
float:left;
min-height:100px;
overflow:auto;
padding:0 20px 0 5px;
width:440px;
}
#right_col1 {
float:left;
overflow:hidden;
padding:0 10px 0 7px;
width:141px;
}
#right_col2 {
float:right;
overflow:hidden;
padding:0 14px 0 0;
width:141px;
}
#right_col1 .menu_heading, #right_col2 .menu_heading {
color:#FFFFFF;
font-size:11px;
letter-spacing:1px;
}
#left_col ul {
list-style-image:url(img/box_menu_pfeil.gif);
list-style-position:inside;
list-style-type:disc;
margin:0;
padding:0;
width:149px;
}
#left_col li {
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:transparent url(img/box_menu_trennlinie.gif) no-repeat scroll center bottom;
margin:0;
padding:5px 0 0 2px;
}
#left_col li ul {
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:transparent url(img/box_menu_trennlinie.gif) no-repeat scroll center top;
width:146px;
}
#left_col li li {
padding-left:16px;
}
#left_col li a {
color:#FFFFFF;
font-size:11px;
font-weight:normal;
padding-left:8px;
text-decoration:none;
}
td {
font-family:Verdana;
font-size:12px;
}
a, #left_col .Cmite a, #left_col .Cnorm a, #left_col .Cdark a {
color:#003366;
font-family:Verdana;
font-size:11px;
text-decoration:underline;
}
a:hover {
text-decoration:none;
}
a.box {
color:#003366;
font-family:Verdana;
font-size:11px;
text-decoration:underline;
}
a.box:hover {
text-decoration:none;
}
.Chead {
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:#16639B none repeat scroll 0 0;
color:#9DBDD4;
}
.Chead a {
color:#9DBDD4;
}
.Chead td, .Chead td strong, .Chead h4, .Chead td b {
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:#16639B none repeat scroll 0 0;
color:#9DBDD4;
}
.Callg {
background-color:#EFEFEF;
color:#000000;
}
.Callg td {
color:#000000;
}
.Cnorm {
background-color:#E5E5E5;
}
.Cmite {
background-color:#B4C6D8;
}
.Cdark {
background-color:#9AB1C8;
}
.rand {
border:1px solid #185685;
}
.smalfont {
font-size:10px;
text-decoration:none;
}
.border {
background-color:#185685;
}
hr {
border-color:#003366;
border-style:solid;
border-width:1px 0 0;
height:0;
}
input, textarea, select {
-x-system-font:none;
background-color:#EFEFEF;
border:1px solid #185685;
color:#000000;
font-family:Verdana;
font-size:12px;
font-size-adjust:none;
font-stretch:normal;
font-style:normal;
font-variant:normal;
font-weight:normal;
line-height:normal;
text-decoration:none;
}

ohne ein spezielles Problem zu nennen wird man dir hier kaum weiterhelfen können...

hellemon · 03.02.2010

AW: CSS / stylesheet erstellen für Ilch?

Ich habe mal zwei Tutorials zu dem Thema gemacht.

Vielleicht hast du danach den Durchblick.

Gruß hellemon

ck08 · 03.02.2010

AW: CSS / stylesheet erstellen für Ilch?

und noch einen oben drauf...finde ich bisher die beste resource wenn es um css und grundverständnis geht (und das meine ich brauchst du hier erstmal - no offend

) - wenn du webseiten "bauen" willst, solltest du zumindest ungefähr wissen, was du tust, sonst gibt es am ende immer nur einen haufen nacharbeit und unzufriedene kunden.

The StyleWorks { Herzlich Willkommen }

CrazyRika · 03.02.2010

AW: CSS / stylesheet erstellen für Ilch?

Danke ich werd es mal probieren nur wie gesagt in sachen css und html bin ich noch nen noob und komm damit noch nicht so klar^^

Tekknoid · 05.02.2011

AW: CSS / stylesheet erstellen für Ilch?

Und nochmal einen drauf.. man sollte sich auch immer im klaren sein wenn man dienste anbietet was brauch/möchte der kunde?

mfg ein nach jahren immernoch noob

Crawford · 06.02.2011

AW: CSS / stylesheet erstellen für Ilch?

Es gibt so "Standard CSS Codes" die jedes Ilch Design braucht um vernünftig im Content Bereich zu funktionieren. Hier eine Übersicht welche CSS Styles ich verwende:

Code:

body {
background : url(Bilder/bg.jpg) no-repeat fixed center;
background-color : #000;
margin : 0 0 0 0;
font-size : 12px;
font-family : Verdana, sans-serif;
color : #fff;
}
br.clear {
clear : left;
text-decoration : none;
}
a:focus {
outline : 0;
text-decoration : none;
}
div.none {
display : none;
text-decoration : none;
}
a {
font : 11px Arial;
color : #fff;
text-decoration : none;
}
a:hover {
color : #ff6c00; <- kann nach belieben geändert werden!
text-decoration : none;
}
.border {
color : #ff6c00; <- kann nach belieben geändert werden!
text-decoration : none;
}
.Chead {
color: #ff6c00; <- kann nach belieben geändert werden!
text-decoration : none;
}
.Cdark {
color: #ff6c00; <- kann nach belieben geändert werden!
text-decoration : none;
}
.Cmite {
color: #ff6c00; <- kann nach belieben geändert werden!
text-decoration : none;
}
.Cnorm {
color: #ff6c00; <- kann nach belieben geändert werden!
text-decoration : none;
}
.smalfont {
font : 12px Arial;
color : #fff;
text-decoration : none;
}
.linkfont {
font : 12px Arial;
color : #fff;
text-decoration : none;
}
fieldset {
border : 1px solid #ff6c00;
text-decoration : none;
}
legend {
font : 12px Arial;
font-weight : bold;
color : #fff;
text-decoration : none;
}
form {
margin : 0;
padding : 0;
text-decoration : none;
}

Wie gesagt das sind nur Beispiele! Aber das sind die Handelsüblichen CSS die für Ilch benötigt werden. Die anderen CSS musst du natürlich noch "erstellen" und dementsprechend einbinden.