Headergrafik einfügen

[Seelenflug]

Hallo!

Ich muss gleich dazu sagen, das ich ein ziemlicher Newbie bin was CSS und Co angeht. Ich hab davon so gut wie gar keine Ahnung, aber ein kleines bisschen bekomme ich dann doch hin.
Momentan hab ich ein Problem, das ich ein Theme (Wordpress) benutze, in das keine Headergrafik eingebunden ist.
Jetzt wollte ich mit:

background-image:url(bild);

eine Headergrafik einfügen. Aber ich weiß gerade nicht so genau wo...

Im Style steht etwas von Header-Section was dann ja richtige wäre.
Darunter steht folgender Code:

/*** Header section ***/

#sitename {
    color:#ffffff;
    height:90px;
    margin:0 20px 10px;
    text-align:left;
}

#sitename h1,#sitename h2 {
    font-weight:400;
    margin:0;
    padding:0;
}

#sitename h1 {
    font-size:2.4em;
    padding-top:20px;
}

#sitename h1 a {
    color: #ffffff;
    text-decoration: none;
    letter-spacing: 5px;
}

#sitename h2 {
    font-size:1.6em;
}

Muss ich dort die Headergrafik einfügen? Und wenn ich die Sitename-Dinger raus lösche, dann wird auch der Seitenname nicht mehr angezeigt, oder?

Sorry, falls ich blöde fragen stelle!
Liebe Grüße, Seelenflug

 

[Arcsinh]

Kannst du uns vllt. einen Testlink zeigen?

 

[Seelenflug]

Achso....
Sorry!

Geht um folgende Seite: 360° ¢

 

[Arcsinh]

Ich denke mal dann, dass dein Header in #sitename rein muss.

 

[Seelenflug]

Aber welcher Sitename ist das richtige?
Und wie kann ich die Grafik zentrieren und die Größe anpassen? Sorry, aber die Codes weiß ich noch nicht.

 

[threadi]

Wenn Du die Grafik skalieren willst, musst Du sie als Bild einfügen und dann an der richtigen Stelle positionieren.

HTML

<div id="sitename"><img src="headergrafik.png" alt="" id="headergrafik" />...[Rest]</div>

CSS

#headergrafik { margin: XY;float: XY; }

Wenn Du die Grafik hinter die Schrift legen willst, musst Du sie als Hintergrundbild einbinden, dann aber geht keine Skalierung, dafür aber eine gute Positionierung.

#sitename {
 background-image: url(headergrafik.png);
 background-position: top center;
}

 

[Seelenflug]

Ich will nicht die Grafik skalieren.
Ich will die Größe bestimmen damit der Header auch groß genug für die Grafik ist.
Momentan würde die Headergrafik da gar nicht rein passen sondern würde abgeschnitten werden.

 

[threadi]

Dann bearbeite entweder die einzufügende Headergrafik so, dass sie passt (mit einer Grafikbearbeitung deiner Wahl) oder vergrößere den Bereich in den die Grafik eingefügt werden soll. Wenn Du sie in #sitename einfügen willst, musst Du am CSS nichts weiter ändern da sich dieser Bereich bereits nach der Größe der beinhaltenden Elemente richtet.

 

[Seelenflug]

Und wie kann ich die Elemente so ändern, das sie groß genug sind für die Headergrafik?

 

[mermshaus]

Wenn du die Grafik als Hintergrundbild setzt, dann zum Beispiel mit den CSS-Eigenschaften width und height beim jeweiligen Element.

 

[Seelenflug]

Ah... Okay. Hab´s jetzt verstanden.
Werd es gleich mal ausprobieren!