background-image

[Chris]

Hi!

Habe mir gerade eine Background Bild erstellt, welches ich als eine Art Wasserzeichen durch einen StyleSheet in den Hintergrund einsetzten will.

body     {
    margin:0; padding:0;                     background-image:url(CS_Logo.jpg);
    background-color: #0066B3;
    font-familiy: arial, helvantica, sans-serif;
    font-size: 17px;
    color: #E0E6F4;
                                }

folgende Probleme habe ich jetzt:

background-image:url(Grafiken/CS_Logo); <-da findet er anscheinend das Bild nicht. Der Pfad muss wohl anders beschrieben werden?

und
ich möchte das background-image Bild kleiner machen
normalerweise ja in HTML mit hight und width. Wie geht das denn in diesem Falle?

Danke
Chris

[lilli]

Hallo

body     {
    margin:0; padding:0;
    background-image:url(CS_Logo.jpg);
    background-color: #0066B3;
    font-familiy: arial, helvantica, sans-serif;
    font-size: 17px;
    color: #E0E6F4;
                                }

folgende Probleme habe ich jetzt:

background-image:url(Grafiken/CS_Logo); <-da findet er anscheinend das Bild nicht. Der Pfad muss wohl anders beschrieben werden?

Ich würde sagen, dass du auf Groß- und Kleinschreibung achten solltest, wenn der Server unter Unix läuft, was wohl der Fall ist. Aber im Prinzip stimmt das, was du hier geschrieben hast schon, auch syntaktisch ist es korrekt

und
ich möchte das background-image Bild kleiner machen
normalerweise ja in HTML mit hight und width. Wie geht das denn in diesem Falle?

Das geht nicht. Dazu musst du schon das Bild manuell verkleinern.
Wäre allerdings ein guter Vorschlag für CSS3 :-)

[lilli]

Hallo nochmal

background-image:url(Grafiken/CS_Logo); <-da findet er anscheinend das Bild nicht. Der Pfad muss wohl anders beschrieben werden?

Ich habe zu spät den Fehler gesehen.

Korrektur:
Es ist normal, dass ein PC/Server kein Bild findet, wenn man es nicht richtig schreibt:

Du hast

background-image:url(Grafiken/CS_Logo);

geschrieben.

Hat das Bild keine Extension? GIF, JPG, PNG ?

Also:

background-image:url(Grafiken/CS_Logo.GIF);

ODER

background-image:url(Grafiken/CS_Logo.JPG);

ODER

background-image:url(Grafiken/CS_Logo.PNG);

So einfach ist das! :-)

[Chris]

»» Ich habe zu spät den Fehler gesehen.

Korrektur:
Es ist normal, dass ein PC/Server kein Bild findet, wenn man es nicht richtig schreibt:

Upps
hatte ich vergessen. Normal war es aber da (.jpg)
Hab jetzt mal .JPG geschrieben und es geht

Hmpf muss ich halt nochmal verkleinern das Bild - egal

Gibts denn so Sachen wie
background-image-align: xxx
background-image-valign:xxx
für die ausrichtund des Bildes?

[Cheatah]

Hi,

Hab jetzt mal .JPG geschrieben und es geht

Du solltest Dir angewöhnen, Dateinamen mit Bedacht zu wählen, so dass eventuell resultierende URIs nicht in Willkür abgleiten.

Gibts denn so Sachen wie
background-image-align: xxx
background-image-valign:xxx
für die ausrichtund des Bildes?

Nein, es gibt background-position.

Cheatah

[Chris]

»» Nein, es gibt background-position.

ahhh ja stimmt!
Danke
mit ceneter und so weiter... jaja

hmmm hab grad gemerkt noch etwas gemerkt...
Hab die Page so mit einer Tabelle gemacht.

|     Menü         |
-------------------------
   |                  |
   |     Text         |
   |                  |
-------------------------
   |                  |

Das Hintergrundbild soll nur in "Text" sein.
Nicht noch ins "menü" gehen.
Aber es ist ja alles eine Seite (keine Frames mit abgrenzung)
Wie kann ich das denn jetzt regeln?

Danke
Chris

[Cheatah]

Hi,

Hab die Page so mit einer Tabelle gemacht.

warum denn das, um alles in der Welt?

Das Hintergrundbild soll nur in "Text" sein.
Nicht noch ins "menü" gehen.
Aber es ist ja alles eine Seite (keine Frames mit abgrenzung)
Wie kann ich das denn jetzt regeln?

Schritt 1: Ersetze die Tabelle durch semantisches Markup. Die vierstelligen Jahreszahlen beginnen mittlerweile mit einer "2".
Schritt 2: Wende die background-Eigenschaften auf genau das bzw. die Elemente an, auf das bzw. die Du sie anwenden möchtest.

Cheatah

[Der Martin]

Hallo Chris,

folgende Probleme habe ich jetzt:

background-image:url(Grafiken/CS_Logo); <-da findet er anscheinend das Bild nicht. Der Pfad muss wohl anders beschrieben werden?

Hat die Bilddatei tatsächich keine Extension? Vielleicht .jpg oder .png?
Falls deine CSS-Datei nicht im gleichen Verzeichnis liegt wie die HTML-Datei, musst du außerdem mit relativen Pfadangaben aufpassen. Die sind nämlich dann nicht relativ zur HTML, sondern zur CSS-Datei.

Übrigens: Es ist beim obigen Beispiel nicht zwingend nötig, aber übersichtlicher ist es allemal, den Dateinamen in Anführungszeichen zu setzen.

Ciao,

Martin

[Ashura]

Hallo Der.

Übrigens: Es ist beim obigen Beispiel nicht zwingend nötig, aber übersichtlicher ist es allemal, den Dateinamen in Anführungszeichen zu setzen.

Weshalb?

Was ist an:

background-image:url("Grafiken/CS_Logo.JPG");

übersichtlicher, als an:

background-image:url(Grafiken/CS_Logo.JPG);

Der Effekt ist der selbe und wenn man nicht gerade einen Editor mit Syntaxhighlight verwendet, merkt man auch beim Überfliegen keinen Unterschied.

Gruß, Ashura

[Der Martin]

Hi,

Was ist an:

background-image:url("Grafiken/CS_Logo.JPG");

übersichtlicher, als an:

background-image:url(Grafiken/CS_Logo.JPG);

Ich finde es im Gesamtkontext generell übersichtlicher, d.h. beim Lesen leichter zu erfassen, wenn Stringkonstanten - auch wenn sie URLs repräsentieren - in Anführungszeichen stehen.

Der Effekt ist der selbe

Ja, klar.

und wenn man nicht gerade einen Editor mit Syntaxhighlight verwendet, merkt man auch beim Überfliegen keinen Unterschied.

Ach? Gerade beim schnellen Überfliegen macht das für mich einen großen Unterschied aus. Wenn die passende Symbolik (beachte den Unterschied zwischen "passend" und "notwendig") verwendet wird, ist Syntaxhilighting meiner Ansicht nach überflüssig, oft nervt es mich sogar, und deshalb stelle ich das meistens gleich ab. Symbole wie Klammern, Anführungszeichen, sinnvolle Einrückungen etc. helfen mir beim Lesen und Erfassen erheblich mehr.
Dass diese Auffassung individuell verschieden ist, dürfte klar sein.

So long,

Martin

[Ashura]

Hallo Der.

Ich finde es im Gesamtkontext generell übersichtlicher, d.h. beim Lesen leichter zu erfassen, wenn Stringkonstanten (...) in Anführungszeichen stehen.

Gut, da stimme ich zu.

Wenn die passende Symbolik (beachte den Unterschied zwischen "passend" und "notwendig") verwendet wird, ist Syntaxhilighting meiner Ansicht nach überflüssig, oft nervt es mich sogar, und deshalb stelle ich das meistens gleich ab.

Ich persönlich habe mich sehr daran gewöhnt. Es erleichtert mir enorm, bestimmte Positionen in Dateien zu finden, ohne die interne Suchfunktion benutzen zu müssen.

Symbole wie Klammern, Anführungszeichen, sinnvolle Einrückungen etc. helfen mir beim Lesen und Erfassen erheblich mehr.

Sicher, früher hatte man ja auch keine Wahl und musste Ankerpunkte anhand besagter Zeichen suchen. Aber wenn mir ein solches Hilfsmittel zur Verfügung gestellt wird, spricht nichts dagegen, wenn ich dieses auch verwende.

Dass diese Auffassung individuell verschieden ist, dürfte klar sein.

Es ist klar. ;)

Gruß, Ashura

[wahsaga]

hi,

Dass diese Auffassung individuell verschieden ist, dürfte klar sein.

dass da auch die broweser verschiedener auffassung sind, und ältere browser mit deiner schreibweise mit klammern teilweise probleme haben, sollte vllt. auch noch bedacht werden.

gruß,
wahsaga