Hilfe - Suche - Mitglieder - Kalender
Vollansicht: Ich brauch Hilfe bei der Erstellung einer css Datei !!!
Forum Sefrengo.org > Allgemeine Foren > Offtopic
Yvette
Ich brauche dringend hilfe beim erstellen des layout und der css datei, vielleicht kann mir jemand die folgenden angaben anpassen, wäre sehr dankbar da ich es einfach nicht hinbekomme.

/*
501
Author: Till
Rev: Y. Kollega
Version: Dec 2009
*/





/* Layout
----------------------------------------------- */

.body { text-align:center;}


div#cc-tp-container {
width:888px;
margin:0 auto;
background:url(http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/bg.png) repeat-y;
text-align:left;
}


* html div#cc-tp-container {
background:none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='scale', src='http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/bg.png');
}


div#cc-tp-header {
position:relative;
width:846px;
margin:0 20px 0px 20px;
}


div#cc-tp-emotion { width:846px; }


div#cc-tp-wrapper { width:868px; }


div#cc-tp-navi {
float:left;
width:178px;
margin-top:16px;
margin-left:7px;
background:url(http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/navi.png) top left repeat-y;
}

* html div#cc-tp-navi {
background:none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='scale', src='http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/navi.png');
}

html > body div#cc-tp-navi { margin-left:15px; }


div#cc-tp-content {
float:left;
width:457px;
margin:16px 0px 35px 6px;
background:url(http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/tent.png) top left repeat-y;
}

* html div#cc-tp-content {
background:none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='scale', src='http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/tent.png');
}


div#cc-tp-sidebar {
position:relative;
float:left;
width:206px;
margin:16px 0px 35px 4px;
background:url(http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/sidebar_bg.png) top right repeat-y;
}


div#cc-tp-footer {
padding:15px 10px 5px 10px;
}


div#cc-tp-footer-bg {
position:relative;
top:7px;
width:888px;
height:7px;
background:url(http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/footer.png) top left no-repeat;
}


* html div#cc-tp-footer-bg {
background:none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='image', src='http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/footer.png');
}





/* Innenabstaende
----------------------------------------------- */

div#cc-tp-sidebar .cc-tp-gutter { padding:0px 7px 15px 17px; position:relative; }
div#cc-tp-content .cc-tp-gutter { padding:0 20px; }
div#cc-tp-footer .cc-tp-gutter { padding:0px 15px; }
div#cc-tp-button .cc-tp-gutter { padding:0 0 0 11px; }








/* Fonts
----------------------------------------------- */

div#cc-tp-footer,
div#cc-tp-footer a, div#cc-tp-footer a:visited,
div#cc-tp-footer td,
div#cc-tp-footer p {
color:white;
}









/* Navigation
----------------------------------------------- */

ul.mainNav1,
ul.mainNav2,
ul.mainNav3 {
margin:0;
padding:0;
list-style-type:none;
}


ul.mainNav1 li a { padding: 5px 0; }
ul.mainNav2 li a { padding: 5px 0; }
ul.mainNav3 li a { padding: 2px 0; }


ul.mainNav1 li { display:inline; }


ul.mainNav1 li a, ul.mainNav1 li a:visited {
display: block;
width:156px;
margin:0;
border-top:1px solid black;
outline:none;
background:#ccc url(http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/button_var.png) no-repeat left bottom;
text-align:center;
text-decoration:none;
cursor:pointer;
color:white;
}


ul.mainNav1 li a:hover {
color:white;
background:#CEB580 url(http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/mouseover.png) no-repeat left bottom;
}

* html ul.mainNav1 li a:hover {
background:none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='scale', src='http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/mouseover.png');
}


ul.mainNav1 li a.current, ul.mainNav1 li a.current:visited,
ul.mainNav1 li a.parent, ul.mainNav1 li a.parent:visited {
color:white;
background:#CEB580 url(http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/mouseover.png) no-repeat left bottom;
}


ul.mainNav2 li a, ul.mainNav2 li a:visited,
ul.mainNav3 li a, ul.mainNav3 li a:visited {
display: block;
width:156px;
margin:0;
border-top:1px solid black;
outline:none;
background: #444;
filter:none;
text-align:center;
text-decoration:none;
color:white;
}


ul.mainNav3 li a, ul.mainNav3 li a:visited {
font-size:80%;
color:#CCC;
}


ul.mainNav2 li a:hover,
ul.mainNav3 li a:hover {
filter:none;
background:#999;
}


* html ul.mainNav2 li a:hover,
* html ul.mainNav3 li a:hover {
filter:none;
background:#999;
}


ul.mainNav2 li a.current, ul.mainNav2 li a.current:visited,
ul.mainNav2 li a.parent, ul.mainNav2 li a.parent:visited,
ul.mainNav3 li a.current, ul.mainNav3 li a.current:visited {
color:#444;
filter:none;
background:#CEB580;
}








/* Header Sub-Elements
----------------------------------------------- */

div#cc-tp-header span#cc-tp-btop {
position:absolute;
z-index:9;
left:-7px;
top:0;
width:860px;
height:11px;
background:url(http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/h_border_t.png) no-repeat left top;
}

* html div#cc-tp-header span#cc-tp-btop {
background:none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='image', src='http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/h_border_t.png');
}


div#cc-tp-header span#cc-tp-bright {
position:absolute;
z-index:8;
left:840px;
top:11px;
width:13px;
height:152px;
background:url(http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/h_border_r.png) no-repeat left top;
}

* html div#cc-tp-header span#cc-tp-bright {
background:none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='image', src='http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/h_border_r.png');
}


div#cc-tp-header span#cc-tp-bbottom {
position:absolute;
z-index:7;
left:-7px;
top:163px;
width:860px;
height:15px;
background:url(http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/h_border_b.png) no-repeat left bottom;
}

* html div#cc-tp-header span#cc-tp-bbottom {
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='image', src='http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/h_border_b.png');
background: none;
}


div#cc-tp-header span#cc-tp-bleft {
position:absolute;
left:-7px;
top:11px;
z-index:6;
width:13px;
height:152px;
background:url(http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/h_border_l.png) no-repeat left top;
}

* html div#cc-tp-header span#cc-tp-bleft {
background:none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='image', src='http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/h_border_l.png');
}







/* Navi Sub-Elements
----------------------------------------------- */

div#cc-tp-navi span#cc-tp-top {
display:block;
width:178px;
height:12px;
background:url(http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/na_top.png) no-repeat left top;
}

* html div#cc-tp-navi span#cc-tp-top {
background:none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='image', src='http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/na_top.png');
}


div#cc-tp-navi span#cc-tp-bottom {
display:block;
width:178px;
height:14px;
background:url(http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/na_bottom.png) bottom left no-repeat;
}

* html div#cc-tp-navi span#cc-tp-bottom {
background:none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='image', src='http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/na_bottom.png');
}







/* Content Sub-Elements
----------------------------------------------- */

div#cc-tp-content span#cc-tp-ctop {
display:block;
width:457px;
height:15px;
background:url(http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/co_border_t.png) no-repeat left top;
}

* html div#cc-tp-content span#cc-tp-ctop {
background:none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='image', src='http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/co_border_t.png');
}


div#cc-tp-content span#cc-tp-cbottom {
position:relative;
display:block;
width:457px;
height:14px;
background:url(http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/co_border_b.png) no-repeat left top;
}

* html div#cc-tp-content span#cc-tp-cbottom {
background:none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='image', src='http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/co_border_b.png');
}






/* Sidebar Sub-Elements
----------------------------------------------- */

div#cc-tp-sidebar span#cc-tp-sidetop {
display:block;
width:206px;
height:16px;
background:url(http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/sid_border_t.png) top left no-repeat;
}


div#cc-tp-sidebar span#cc-tp-sidebottom {
display:block;
width:206px;
height:16px;
background:url(http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/sid_border_b.png) top left no-repeat;
font-size:0px;
}
pawel
Das ist doch nicht dein Ernst, dass du uns hier eine CSS-Datei um die Ohren klatscht.
Stell Dir mal eine (Word)Formatvorlage ohne Dokument vor. Das ist komplett sinnvoll.
Stylesheets müssen sich auf eine Dokumentenstruktur (also das HTML) beziehen.

Am besten Du fragst den Autor.
Ansonsten brauche ich regelmäßig auch Hilfe, sage aber nicht wofür und wobei.
Yvette
da hast du mich wohl bischen missverstanden aber egal....

es ging um die einträge wie z.B.

* html div#cc-tp-content span#cc-tp-cbottom {
background:none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='image', src='http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/co_border_b.png');

ich habe bereits ein layout "HTML" und eine css datei mit den regeln erstellt aber es gibt hier in dieser css datei einträge wie z.b. der hier oben, womit ich nicht weiß wohin

und z.b. solche einzträge padding:15px 10px 5px 10px;
pawel
Du willst also die CSS erklärt haben?
Diese wurde für alte IE entwicklt, die noch keine Alphatransparenzen beherrschten. Kannst du heute vermutlich ersatzlos streichen.

Für eine Anpassung der CSS ist es nötig, die HTML-Struktur zu kennen.

Yvette
ja, so ungefähr.

es handelt sich hierbei um eine seite die momentan noch bei einem anderem anbieter ist und ich möchte die jetzt in sefrengo einbinden und dann bei dem anderem anbieter kündigen.

wie komme ich an die html-struktur ran? über seitenquelltext ?
FireFlyer
Über den Quelltext, genau!
Yvette
Bsten Danke FireFlyer, das ist doch mal nen korrekte antwort, ich versuchs ob ich klar komme
paulinsche
Hier ein paar Links zu den Themen HTML und CSS:
Little Boxes
css4you
selfHTML

Yve
habe das soweit jetzt alles hinbekommen bis auf die navigation (weil drei ebenen und 1. und 2. / 3. verschieden) dabei brauche ich auf jeden fall hilfe danke schon mal im voraus

/* Navigation
----------------------------------------------- */

ul.mainNav1,
ul.mainNav2,
ul.mainNav3 {
margin:0;
padding:0;
list-style-type:none;
}


ul.mainNav1 li a { padding: 5px 0; }
ul.mainNav2 li a { padding: 5px 0; }
ul.mainNav3 li a { padding: 2px 0; }


ul.mainNav1 li { display:inline; }


ul.mainNav1 li a, ul.mainNav1 li a:visited {
display: block;
width:156px;
margin:0;
border-top:1px solid black;
outline:none;
background:#ccc url(http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/button_var.png) no-repeat left bottom;
text-align:center;
text-decoration:none;
cursor:pointer;
color:white;
}


ul.mainNav1 li a:hover {
color:white;
background:#CEB580 url(http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/mouseover.png) no-repeat left bottom;
}

* html ul.mainNav1 li a:hover {
background:none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='scale', src='http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/mouseover.png');
}


ul.mainNav1 li a.current, ul.mainNav1 li a.current:visited,
ul.mainNav1 li a.parent, ul.mainNav1 li a.parent:visited {
color:white;
background:#CEB580 url(http://u.jimdo.com/www25/o/layout/l16350a48357ab226/img/mouseover.png) no-repeat left bottom;
}


ul.mainNav2 li a, ul.mainNav2 li a:visited,
ul.mainNav3 li a, ul.mainNav3 li a:visited {
display: block;
width:156px;
margin:0;
border-top:1px solid black;
outline:none;
background: #444;
filter:none;
text-align:center;
text-decoration:none;
color:white;
}


ul.mainNav3 li a, ul.mainNav3 li a:visited {
font-size:80%;
color:#CCC;
}


ul.mainNav2 li a:hover,
ul.mainNav3 li a:hover {
filter:none;
background:#999;
}


* html ul.mainNav2 li a:hover,
* html ul.mainNav3 li a:hover {
filter:none;
background:#999;
}


ul.mainNav2 li a.current, ul.mainNav2 li a.current:visited,
ul.mainNav2 li a.parent, ul.mainNav2 li a.parent:visited,
ul.mainNav3 li a.current, ul.mainNav3 li a.current:visited {
color:#444;
filter:none;
background:#CEB580;
}
jwitt
und wie lautet die Frage?
Yve
die frage lautet....

wie ich das jetzt in sefrengo umsetze ...

die erste ebene habe ich
luxli
Hallo Yve

Dein Problem hat eigentlich nichts mit Sefrengo zu tun. Hilfe für CSS und HTML hole ich in der Regel im Html-Forum das dürfte auch in deinem Fall die richtige Adresse sein.

Dies als Ergänzung zu den von paulinsche erwähnten Adressen.
paulinsche
Schau dir doch die Dokumentation Schnelleinstieg Tutorial - Die erste Sefrengo Webseite erstellen an.
Da ist alles sehr gut erklärt. Und bei der Navigation schaust du dir am besten erst mal an, wie das Modul den Code ausgibt und erstellt dann die CSS dementsprechend.
Dieses ist eine vereinfachte Darstellung unseres Foreninhaltes. Um die detaillierte Vollansicht mit Formatierung und Bildern zu betrachten, bitte hier klicken.
Invision Power Board © 2001-2024 Invision Power Services, Inc.