wieso wird bei meinem template das logo nicht angezeigt?
lima-city → Forum → Die eigene Homepage → Homepage Allgemein
auslese
auswirkung
bereich
bild
boxen
code
container
element
ersetzen
formatierung
http
image
index
ordner
tag
teil
teilen
test
url
versuchen
-
body {font size: 12px; font-family: Helvetica,Arial,sans-serif; background-tag/image">image: url("5_friedenstaube.jpg");
background-position: center; background-attachement: fixed;}
#Teil1 {img src:"bff_logo.jpg"; alt="Logo"; float: left; width: 100%; height: 4em;}
#Teil2 { border: 2px dotted yellow;
float: left;
width: 100%;
}
#Teil3 { border: 2px dotted red;
float: left;
width: 100%;
}
das ist ein teil meines css-codes...leider werden mir die bilder nicht im template angezeigt, welches ich (immer noch) versuche zu erstellen.
ich hätte dieses template gerne für meine joomla seite.
was kann/muss ich tun um diese bilder angezeigt zu bekommen? -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
Befindet sich die Datei im selben Verzeichnis, wie die Seite? Dann versuchs vielleicht mal mit "./5_friedenstaube.jpg". Außerdem ist dein CSS fehlerhaft. Tus mal validieren http://jigsaw.w3.org/css-validator/.
PS: Ein Link zu deiner Seite wär nicht schlecht.
Beitrag zuletzt geändert: 11.1.2011 21:02:25 von mator-kaleen -
ok, der validator hat mir das jetzt gerichtet, allerdings sind die bilder komplett rausgeflogen...
leider ist die seite noch offline, bin grad erst dabei, mich etwas intensiver mit der ganzen materie auseinander zu setzen.
wie ist denn jetzt der code für so ein bild, das ist doch...img src:"image.jpg";... oder!?
body { background-image: url(bff_logo.gif);}
#Teil1 {
float : left;
width : 100%;
height : 4em;
}
#Teil2 {
border : 2px dotted yellow;
float : left;
width : 100%;
}
#Teil3 {
border : 2px dotted red;
float : left;
width : 100%;
}
#Bereich1 {
background-image: url(bff_logo.gif);
}
#Bereich2 {
border : 1px dashed silver;
margin : 0 0 1.1em;
background-color : green;
float : left;
width : 100%;
}
#Bereich3 {
border : 1px dashed silver;
background-color : red;
float : right;
}
#Bereich4 {
border : 1px dashed silver;
float : right;
width : 15em;
}
#Bereich5 {
border : 1px dashed silver;
float: right;
}
#Bereich6 {
border : 1px dashed silver;
margin : 0 0 1.1em;
width : 60%;
background-color : blue;
}
#Bereich7 {
border : 1px dashed silver;
margin : 0 0 1.1em;
background-color : rgb(238, 238, 238);
}
das ist jetzt mein neues css...der validator sagt is alles ok aber bilder seh ich trotzdem noch keine!
Beitrag zuletzt geändert: 12.1.2011 7:28:31 von it-heberle -
Nimm mal die Bilder in Gänsefüsschen. Danach sollte es gehen.
Beispiel:
background-image:url("bff_logo.gif");
Gruß S.Brosch -
hab jetzt so ziemlich jede erdenkliche möglichkeit versucht, das bild wird nicht angezeigt...wenn ich es in der index.php einbinde geht das, meine frage allerdings ist, ob es dann auch auf allen weiteren seiten angezeigt wird
-
Wie meinst du das eingebunden: Mit Hilfe des <img>-Tags ?
Wenn du das nur auf der index.php machst dann erscheint es auch nur auf dieser Seite. Du verwendest ja glaube ich ein CMS oder ähnliches. Dafür hast du ja bestimmt ein Template. In diesem Template kannst du die Bilder einfügen die auf jeder Seite an der gleichen Position angezeigt werden sollen.
Gruß S.Brosch -
Wenn es auch hier um deine Experimente mit dem Joomla-Template geht, ist das Problem ähnlich, wie in deinem anderen Thread zum Thema.
In welchem Ordner (relativ zum Domain-root) liegen die Bilder und in welchem Ordner das CSS?
So wird es dann funktionieren:
background-image:url("/alle/Ordner/bis/zum/Bild/bff_logo.gif");
FF -
jaja, es sind immer noch die gleichen experimente...
so wie bei dir beschrieben ...background-image:url("/Joomla/templates/test/images/bff_logo.gif");...
hab ich schon...
hab jetzt mal im body versucht und da macht es...wenn ich es aber in teil 1 oder bereich 1 versuche, zeigt es mir da nix...muss ich da irgendwelche weiteren einstellungen machen oder welche weglassen oder was soll ich den tun? google hilft mir auch nicht weiter, hab da zwar tolle anleitungen aber offensichtlich bin ich einfach zu doof.
hier nochmal der teil um den es geht:
body {
background-color: white;
}
#Teil1 {
background-image:url("/Joomla/templates/test/images/bff_logo.gif");
}
#Teil2 {
float : left;
width : 100%;
margin: 1em;
}
#Teil3 {
float : left;
width : 100%;
}
#Bereich1 {
margin : 0em 15em 0em 15em;
}
#Bereich2 {
margin : 0em 15em 1em 15em;
background-color : green;
height: 3em;
font-size: 16px;
}
...also ich bin jetzt schonmal soweit, dass ich mit den bildern ein bisschen spielen kann...leider wird es mir immer noch nicht in teil1 oder bereich1 angezeigt, wo ich es eigentlich haben möchte...
Beitrag zuletzt geändert: 12.1.2011 11:14:12 von it-heberle -
Wenn es im Body geht dann hast du schonmal den richtigen Pfad. Wenn aber im Bereich1 oder Teil1 nichts angezeigt wird hast du wahrscheinlich die falschen ID-Bezeichnungen in deiner index.php verwendet. Kannst du mal bitte noch den Code der index.php zur Verfügung stellen. Es würde wahrscheinlich weiterhelfen wenn man da auch mal einen Blick reinwirft.
Gruß S.Brosch -
it-heberle schrieb:
hab jetzt mal im body versucht und da macht es...wenn ich es aber in teil 1 oder bereich 1 versuche, zeigt es mir da nix...
Groß-/Kleinschreibung der ID-Bezeichner in CSS und HTML sind identisch?
FF
-
jup, sind alle identisch
...das ist mein html...
<html>
<head>
<link rel="stylesheet" type="text/css" href="/Joomla/templates/test/css/template.css"></link>
<title>index.php</title>
<jdoc:include type="head" />
</head>
<body>
<div id="Teil1">
<div id="Bereich1"></div>
</div>
<div id="Teil2">
<div id="Bereich2"><jdoc:include type="modules" name="breadcrumb" style="rounded" /></div>
<div id="Bereich3"><jdoc:include type="modules" name="right" style="xhtml" /></div>
<div id="Bereich4"><jdoc:include type="modules" name="left" style="xhtml" /></div>
<div id="Bereich6"><jdoc:include type="component" style="xhtml"/></div>
</div>
<div id="Teil3">
<div id="Bereich7"><jdoc:include type="modules" name="footer" style="xhtml" /></div>
</div>
</body>
</html>
Beitrag zuletzt geändert: 12.1.2011 11:18:26 von it-heberle -
Ich hab den Fehler gefunden. ich habe das mal lokal getestet. Du musst im Teil1 und Bereich1 eine Höhe angeben sonst ist das allerhöchstens 1px hoch. Gebe allen Bereichen und Teilen eine Höhe.
Wenn du die Auswirkung einer fehlenden Höhe testen willst dann nimm mal die Höhe aus dem Bereich2 raus. Die Box verschwindet vollständig. Wenn du jetzt was in die Box schreibst dann ist die Box so hoch wie deine Schrift.
Fazit:
Gebe allen Bereichen und Teilen eine Hoehe und Breite. Wenn nur das Bild darin abgebildet wird dann nimm die Größe des Bildes.
Gruß S.Brosch -
goil, dat funzt ja richtig! vielen dank!!!
und wie lass ich jetzt meine navi so aussehen wie hier?
http://www.basisfuerfrieden.de/
-
Kennst du Firebug (Mozilla Firefox) ?
Mit diesem kleinen Tool und Mozilla Firefox kannst du eine Website komplett mit Formatierung auslesen. So könntest du auch das Menü auslesen. Einfach mit dem Firefox mit Google nach Firebug suchen und anschließend installieren. Ich würde aber aufpassen mit so Sachen wie Menü nachbauen, da solche Sachen eigentlich urheberrechtlich geschützt sind.
Im Grunde musst du nur in deinen Bereich2 kleine div-Container einfügen und diese Ausrichten.
Hier mal ein Codebeispiel von http://www.tutorial5.com/content/view/147/52/. Das brauchst du eigentlich nur in deinen Bereich2 einfügen und anpassen:
<html> <head> <style type="text/css"> ul{ list-style-type:none; } li{ display:inline; } a{ float:left; width:100px; text-decoration:none; color:white; font-weight:bold; background:#999900; padding:5px; border-right:1px solid #FFFFFF; } a:hover{ background:#CCCC00; } </style> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>CSS horizontal menu</title> </head> <body> <ul> <li><a href="#">Css</a></li> <li><a href="#">Flash</a></li> <li><a href="#">ActionScript</a></li> <li><a href="#">Javascript</a></li> <li><a href="#">SQL Server </a></li> <li><a href="#">PHP</a></li> </ul> </body> </html>
Schau mal auf der Homepage vorbei da findest du noch eine getrennte Variante ansonsten einfach mal googeln.
Gruß S.Brosch -
yeah, das hilft schon ganz gewaltig!
allerdings wird durch dass ul-element der komplette befehl auf die ganze seite übernommen...
eigentlich kommt doch da einfach nen div-container rein oder!?
mensch, ich raffs einfach nicht... -
Du kannst auch dem <ul>-Element eine Klasse zuordnen:
<ul class="klasse"></ul>
Somit kannst du ihn auch individuell anpassen. Allerdings kann ich dir nicht sagen ob eine ul-Formatierung trotzdem Auswirkungen hat, zusätzlich der Formatierung in der Klasse. Das sicherste wäre wenn du alle <ul>-Elemente mit einer Klasse formatierst.
ODER:
Dein Vorschlag mit dem <div>-Container geht auch. Dazu musst du nur das <ul>-tag durch ein <div>-Tag ersetzten. So:
<div class="klassenname"> <li><a href="#">Css</a></li> <li><a href="#">Flash</a></li> <li><a href="#">ActionScript</a></li> <li><a href="#">Javascript</a></li> <li><a href="#">SQL Server </a></li> <li><a href="#">PHP</a></li> </div>
Wenn du allerdings auch die <li>-Tags ersetzen willst dann solltest du dich mal mit float beschäftigen. Denn je nach dem wie weit man es treibt kann es ganz schön kompliziert werden. Hoffe das hilft dir weiter!
Gruß S.Brosch -
ul durch div ersetzen ist Quatsch! Dann stimmt die HTML-Syntax für Listen nicht mehr.
@it-heberle: Du hast dich schon damit beschäftigt, wie Joomla Menüs generiert und an das Template ausliefert? Wenn nein, wäre es jetzt der passende Moment.
FF -
@ fatfreddy, wo finde ich den entsprechende literatur um herauszufinden, wie das vonstatten geht?
...
oh nein, jetzt verschiebt es mir den inhalt auch noch und setzt die artikel nebeneinander und weit über die margin hinaus
(margin: 1em 15em 1em 15em;)
Beitrag zuletzt geändert: 13.1.2011 7:48:24 von it-heberle -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
