Hilfe zu Hintergrundgrafik??

Lona · 24.11.2010

Kann mir mal jemand sagen,wie ich eine Hintergrundgrafik in css definiere?
Es ist ein schmaler streifen,der gekachelt werden soll vertikal. er soll in den Kopfbereich und ich habe ihn farbverlauf.jpg genannt,er befindet sich im gleichen Ordner wie die css datei,hab schon versucht aber es wird nich angezeigt,hab sicher einen Fehler gemacht und weiss nich welchen...
könnte mir eventuell jemand helfen?
Wäre ganz nett

das ist das was ich reingeschrieben habe

div#kopfbereich {
background-color: #ffffff; /* white */
color: black;
}

background-image: url(farbverlauf.jpg);
#kopfbereich {
background: #ffe574 url(farbverlauf.jpg) repeat-y left top;
}

Gackoo_duz · 24.11.2010

AW: Hilfe zu Hintergrundgrafik??

div#kopfbereich {
background-color: #ffffff; /* white */
color: black;
}

die muss weg

background-image: url(farbverlauf.jpg);
#kopfbereich {
background: #ffe574 url(farbverlauf.jpg) repeat-y left top;
}

es geht nur eins nach dem anderen!!

#kopfbereich
{
background-color: #FFF;
background-image: url(farbverlauf.jpg);
background-repeat: repeat-y;
background-position: left top;
height: 400px;
width: 300px;
color: #000;
}

schreibe die Anweisungen so sauber wie möglich!!! (Einrücken)

owieortho · 24.11.2010

AW: Hilfe zu Hintergrundgrafik??

Zumindest steht mal die background-image-Deklaration außerhalb der geschweiften Klammern.

Ladyan · 24.11.2010

AW: Hilfe zu Hintergrundgrafik??

Hi Lona,

weshalb denn so viele unterschiedliche Anweisungen? Du gibts zwei verschiedene Hintergrundfarben plus eine Grafik an, und das in teils richtiger teils falscher Syntax.

Kürze deine CSS-Anweisung doch mal auf die relevanten Teile, beispielsweise so:

Code:

#kopfbereich {
    background-image: url(farbverlauf.jpg) top left repeat-y;
}

Vielleicht hast du ja auch mal einen Link zur Seite?

Lg

Lona · 24.11.2010

AW: Hilfe zu Hintergrundgrafik??

Ich fange ja erst an mit CSS,drum weiss ich noch nicht genau wie ichs machen muss,deshalb meine Fragen...ich bedanke mich für die Antworten und werde es nochmal machen(hoffentlich klappt es dann)
Die Seite ist nicht online deshelb keineAdresse es sollte nur eine Übung sein,und schon bin ich gescheitert...schade
LG Lona

owieortho · 24.11.2010

AW: Hilfe zu Hintergrundgrafik??

Lona schrieb:
... sollte nur eine Übung sein,und schon bin ich gescheitert...schade
LG Lona

So haben fast alle angefangen. Das ist wirklich nicht schwer. Bau sowas am Anfang Stück für Stück auf und kontrolliere jeden Schritt. Und lass Dich bloß nicht entmutigen.

Ladyan · 24.11.2010

AW: Hilfe zu Hintergrundgrafik??

Richtig. Nur nicht verzweifeln, das wird schon

Chickenshooter · 24.11.2010

AW: Hilfe zu Hintergrundgrafik??

Moin

Die Pfade sind wichtig.... wie so oft

Immer nur relative Pfade siehe CSS Datei styles.css nie absolute Pfade
da kann denn schon mal so etwas stehen (linux) "/var/www/lona/css/images/farbverlauf.jpg".
Dieses Verzeichnis gibt es aber bei Deinem Hoster nicht, deshalb relative Pfade ausgehend
von der Datei die den pfad "aufruft" in unserem Fall die styles.css für die Grafiken.

im ordner lona die index.html
Quelltext:

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>CSS :: Test</title>
        <link href="css/styles.css" rel="stylesheet" type="text/css" media="all" />
    </head>
    <body>
        <div id="kopfbereich">Hallo Welt mit HTML und CSS</div>
        <div id="inhalt">Inhalt</div>
    </body>
</html>

im ordner css die Datei styles.css

HTML:

#kopfbereich
{
    background: #BEDBE9 url(images/farbverlauf.jpg) repeat-y 0px 0px scroll;
    width:600px;
    height:70px;    
}

#inhalt
{
    background:#999 url(../siteimages/siteBG.jpg) repeat 0px 0px scroll;
    display:block;
    width:600px;
    height:200px;
    font-weight:bold;
    color:#333;
    font-size:150%;    
}

das Ergebnis im Browser (klick)

hier das "kleine Projekt" als zip, brauchst Du bei Dir nur entpacken läuft sofort (relative Pfade)
download

MfG

K_Back · 25.11.2010

AW: Hilfe zu Hintergrundgrafik??

Gackoo_duz schrieb:
schreibe die Anweisungen so sauber wie möglich!!! (Einrücken)

Wenn du ersdt mit CSS, HTML und so anfängst, dann ist das auf jedenfall einer der Besten Tipps, den je sauberer du ein Scrpt schreibst desto besser kannst du fehler finden, ausbesser oder gar nicht entstehen lassen. Desweiteren Sieht es dann auch besser aus und übersichtlicher, denn du weißt dann das sich im bereich "X" nicht auch ein "Y" befindet.

Schau das du dich daran hälst dann wird das schon was.

Lona · 25.11.2010

AW: Hilfe zu Hintergrundgrafik??

Danke für eure aufmunternden Worte....ich werde es nochmals von Anfang an versuchen...
Dir Shickenshooter besonderen Dank für die Zipp...
LG Lona

Chickenshooter · 26.11.2010

AW: Hilfe zu Hintergrundgrafik??

Ein Dankeschön hört man immer gerne, das sollten sich andere User in

diesem Forum auch auf die Fahne schreiben.

Gerne wieder wenns nicht zu viel Zeit kostet.

Davon hab ich nur 24h pro Tag oder war'n es doch 25....

MfG

Lona · 26.11.2010

AW: Hilfe zu Hintergrundgrafik??

Ich wollte nur Bescheid sagen,dass ich es mit Hilfe von Little Boxes hinbekommen habe meine erste CSS datei auch mit der HG Grafik...ich freue mich total es ist ein Anfang aber ich muss noch gaaanz viel lernen,da werd ich sicher noch Fragen haben...so ganz richtig hab ichs noch nicht kapiert,aber wenn du 25 Std.am Tag hast lieber Shickenshooter da komme ich gerne nochmal auf dich zurück *gg*
Dankeschön dass ihr mir Mut gemacht habt.
Knuddels Lona