Fragen zur Layoutveränderung

[4anni]

Hallo zusammen,

habe mich nun für ein Layout für meine HP entschieden: Compromise.

Nun meine Fragen:

1.) Wie bekomme ich es hin, dass die Überschrift mit Großbuchstaben beginnt?

2.) Wie kann ich oben rechts (also im Feld der Überschrift) mein Logo einbinden?

3.) Wo genau kann ich die Farbe Orange im Menü-Hintergrund und im Bild, welches sich quer über die ganze Seite zieht ändern?

Meine Seite: www.schmidt-pb.de

Ich bräuchte eine Anleitung für "absolute Beginners".  

Vielen Dank!
Grüße
4anni

[azett]

1.) Wie bekomme ich es hin, dass die Überschrift mit Großbuchstaben beginnt?

Schau in die CSS-Datei des Layouts:

Code Auswählen Erweitern

#logo h1 {
float: left;
padding: 30px 0 0 20px;
margin-right: 10px;
letter-spacing: -1px;
text-transform: lowercase; // Das hier sorgt dafür, daß alle Buchstaben klein dargestellt werden.
font-size: 2.8em;
}

2.) Wie kann ich oben rechts (also im Feld der Überschrift) mein Logo einbinden?

Ein möglicher Vorschlag: Bau es in der Template-Datei in dieser Art ein:

Code Auswählen Erweitern

<div id="logo">
<h1><a href="#">hier sollen die anfangsbuchst. gross sein</a></h1>
<img src="pfad/zum/bild.jpg" alt="Seitenlogo" style="float:right;margin:10px;" />
</div>

3.) Wo genau kann ich die Farbe Orange im Menü-Hintergrund und im Bild, welches sich quer über die ganze Seite zieht ändern?

In der CSS-Datei siehst du, daß der orangefarbene Streifen unterm Menü aus der Bilddatei layouts/compromise/grafiken/img03.jpg kommt:

Code Auswählen Erweitern

#menu {
width: 900px;
height: 44px;
background: url(../grafiken/img03.jpg) no-repeat left top; // HIER als Hintergrundbild definiert :)
margin: 0 auto;
padding: 0;
} Noch einfacher findest du das heraus, indem du auf das Menü einen Rechtsklick machst und "Hintergrundgrafik anzeigen" wählst (so gehts zumindest im Firefox).

Die Hintergrundfarbe des aktiven Menüpunkts* findest du auch in der CSS-Datei:

Code Auswählen Erweitern

#menu .menuactive {
margin-right: 3px;
background: #FF7900;  //...nämlich HIER :)
}* Der CSS-Selektor "#menu .menuactive" gilt nur für den Menüpunkt der aktuell angezeigten Kategorie (um diese für den Besucher hervorzuheben). Andere Kategorien bekommen die dort eingestellte Hintergrundfarbe nicht (teste das, indem du eine zweite Kategorie und darin wenigstens eine Inhaltsseite anlegst).


Viel Spaß beim Anpassen

[4anni]

Hallo!

Vielen, vielen Dank schon mal für Deine Antwort.

Die erste Frage hat sich, dank Deiner Hilfe, erledigt.

Jetzt arbeite ich gerade an der zweiten Frage:

Wenn ich es so mache, wie Du vorgeschlagen hast, lautet die Zeile im Template:

<img src="layouts/compromise/grafiken/mein-logo.jpg" alt="Seitenlogo" style="float:right;margin:10px;" />

Ist das Richtig?

Ich bekomme dann nämlich nur anstatt des Logos, den Textzug "Seitenlogo" angezeigt.

Was mache ich falsch?

Das Logo habe ich im Ordner Grafiken abgespeichert.

Muss ich auch das gallerytemplate ändern oder nur die template. Habe schon beides versucht, leider immer nur mir dem gerade beschriebenen Ergebnis.

Grüße
4anni

[Micha]

Also wenn ich http://www.schmidt-pb.de/layouts/compro ... beratu.jpg aufrufe kommt

Code Auswählen Erweitern

Not Found

The requested URL /layouts/compromise/grafiken/Logo-Schmidt-Personalberatu.jpg was not found on this server.
Sicher daste es auch hochgeladen hast?

[4anni]

Boah, bin ich bescheu...!

Habe im Template ".jpg" statt ".png" eingetragen. Kein Wunder, dass es nicht gefunzt hat.

Aber neue Frage: Wie bekomme ich das Logo noch weiter nach rechts, also ganz an den Rand?

Grüße
4anni

[Micha]

Schreibste ins css wo du das Headerbild definiert hast

Code Auswählen Erweitern

background-position:right;


[4anni]

Sorry, aber damit kann ich leider gar nichts anfangen.

Blicke im css nicht durch, welche Stelle nun genau für mein Logo zuständig ist.

Mist!!!

[Micha]

Hm...seh gerade das du es ins Template eingebaut hast.

Kanns es auch in css einbauen bei #logo

Müsste dann so aussehen

Code Auswählen Erweitern

#logo {

        width: 640px;
color: #000000;
background-image:url("../grafiken/Logo-Schmidt-Personalberatu.png");
background-position:right;
background-repeat:no-repeat;
}



Müsste eigtl so klappen....hab die ganzen sachen auch nicht so im Kopf....musste dann allerdings das Bild ausm Template rauslöschen.

[4anni]

Danke Micha für Deine Hilfe!

Ist es eigentlich egal an welcher Stelle ich den ganzen Quatsch einbinde oder muss es zwingend an einer bestimmten Stelle im css sein?

[Micha]

Wo das im css steht ist eigtl völlig Pumps....solange es richtig und nicht doppelt drin steht

[4anni]

Also ich steh immer noch auf dem Schlauch. So schaut mein css derzeit aus:

/* Logo */

#logo {
   float: left;
   width: 640px;
   color: #000000;
}

#logo h1, #logo p {
}

#logo h1 {
   float: left;
   padding: 30px 0 0 20px;
   margin-right: 10px;
   letter-spacing: -1px;
   text-transform: ;
   font-size: 2.8em;
}

#logo h1 a {
   color: #C00000;
}

#logo p {
   float: left;
   margin: 44px 0 0 0;
   padding: 3px 10px 3px 0px;
   font: normal 13px Georgia, "Times New Roman", Times, serif;
   font-style: italic;
}

#logo a {
   border: none;
   background: none;
   text-decoration: none;
   color: #000000;
}

Wo schreibe ich jetzt den "neuen Teil" hin, bzw. was lösche ich oder tausche ich aus?

Grüße
4anni

[Micha]

Direkt das erste #logo

Also dieses

Code Auswählen Erweitern

#logo {
float: left;
width: 640px;
color: #000000;
}


[4anni]

Also, hab´s jetzt mal über das css versucht. Klappt leider nicht.

Kann mir jemand sagen, wie ich das Logo über eine Veränderung des Templates ganz nach rechts bekomme?

Danke Euch!

Grüße
4anni