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;
}
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.
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;
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.
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 ?
Über den Quelltext, genau!
Bsten Danke FireFlyer, das ist doch mal nen korrekte antwort, ich versuchs ob ich klar komme
Hier ein paar Links zu den Themen HTML und CSS:
http://little-boxes.de/
http://www.css4you.de/
http://de.selfhtml.org/
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;
}
und wie lautet die Frage?
die frage lautet....
wie ich das jetzt in sefrengo umsetze ...
die erste ebene habe ich
Hallo Yve
Dein Problem hat eigentlich nichts mit Sefrengo zu tun. Hilfe für CSS und HTML hole ich in der Regel im http://www.html.de/forum.php das dürfte auch in deinem Fall die richtige Adresse sein.
Dies als Ergänzung zu den von paulinsche erwähnten Adressen.
Schau dir doch die Dokumentation http://wiki.sefrengo.org/handbuch/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.
Unterstützt von Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)