MO Scherer: Wie kann man ein Hintergrundbild mit css abschalten?

Hallo zusammen.
Ich habe ein kleines Problem. hab auch schön überall nach einer Lösung gesucht, aber noch keine gefunden.
Folgendes:
Ich habe in meiner css-Datei ein fixes Hintergrundbild definiert, welches auf allen Seiten immer an genau der gleichen Position erscheinen soll. Funktioniert tadellos:

BODY {
            scrollbar-base-color: #000000;
            scrollbar-track-color: #000000;
            scrollbar-face-color: #000000;
            scrollbar-highlight-color: #ffffff;
            scrollbar-3d-light-color: #000000;
            scrollbar-darkshadow-color: #000000;
            scrollbar-shadow-color: #ffffff;
            scrollbar-arrow-color: #ffffff;

background: #ffffff;
  background-color: #ffffff;
  background-image: url("../Grafiken/allgemein/king.jpg");
  background-position: 100% 0%;
  background-repeat: no-repeat;
  color: #000000;
  font-family: Arial,Helvetica,sans-serif;
  font-size: 10pt;
  font-weight: lighter;
  margin-left: 0px;
  margin-right: 0px;
  margin-top: 0px;
}

Nun möchte ich aber auf einigen wenigen Seiten, welche ich über Inline Frames einbinde, diese Grafik nicht haben.
Wie bekomme ich sie da weg???
Habe schon alles probiert, in der Datei selbst. Mit einer leeren Grafik mit Hintergrundfarbe...etc.

Wäre sehr schön, wenn mir jemand einen Tip geben könnte

Gruß

MO

  1. Hallo zusammen.

    Wäre sehr schön, wenn mir jemand einen Tip geben könnte

    Wie wäre es mit "visibility:hidden" auf den Seiten, wo du dein Hintergrundbild nicht haben möchtest!

    1. Ich überlege grade, ob es nicht an den Inline-Frames liegt, dass du das nicht wegbekommst. Vielleicht übernehmen die Inline-Frames ja immer das Style Sheet von der "Mutterseite".

      Sonst probier doch einfach mal, für diese speziellen Seiten eine zweite css-Datei anzulegen, die identisch ist mit deiner ersten, bis auf die Zeile mit dem Hintergrundbild. Die lässt du entweder weg oder gibst einfach einen Pfad zu einer Datei an, die es gar nicht gibt.

      1. Sonst probier doch einfach mal, für diese speziellen Seiten eine zweite css-Datei anzulegen.....

        Hmmm...dann kann ich die Stylesheets gleich weglassen. Ist etwas inkonsequent, oder?
        Aber trotzdem vielen Dank für die schnelle Antwort.

    2. Wie wäre es mit "visibility:hidden" auf den Seiten, wo du dein Hintergrundbild nicht haben möchtest!

      Und wie genau sollte das funktionieren?

      MI

      --
      : Michael Jendryschik : michael@jendryschik.de : http://jendryschik.de/ :
      : Einführung in XHTML, CSS und Webdesign   http://jendryschik.de/wsdev/ :
      : Monatlich das Beste aus de.alt.netdigest http://best-of-netdigest.de/ :
  2. Hallo mo,

    Nun möchte ich aber auf einigen wenigen Seiten, welche ich über Inline Frames einbinde, diese Grafik nicht haben.
    Wie bekomme ich sie da weg???
    Habe schon alles probiert, in der Datei selbst. Mit einer leeren Grafik mit Hintergrundfarbe...etc.

    <head>
    <style type="text/css">
    body {background-image: none;}
    </style>
    </head>

    sollte gehen.

    Gruß Susanne

    1. Nachtrag

      noch was vergessen: die Reihenfolge ist wichtig!

      <head>

      <link rel="stylesheet" ...

      <style type="text/css">
      body {background-image: none;}
      </style>
      </head>

      zuerst das externe Stylesheet einbinden, dann die lokale Style-Definition.

      gruß Susanne

      1. Nachtrag ....»» gruß Susanne

        Hi Susanne

        Dankeschöööön.
        Das hat funktioniert.
        Ich hatte nämlich noch ein Problem dazu. Dadurch, dass wir hier in der Firma so ein sündhaft teures Content-Management-System einsetzen, kann ich nicht einfach definitionen in den <head></head>
        schreiben, sondern muss alles in den Body-bereich schreiben.
        Aber da es eine JSP-Seite ist und diese ja auf dem Server übersetzt wird, funktioniert es auch, wenn ich es direkt nach dem <body> Tag reinschreibe.

        Vielleicht finde ich noch eine elegantere Lösung.

        Hast du noch eine Idee warum nachfolgende Lösung nicht funktioniert?
        (Zusätzliche Klasse zur normalen Body-Definition. Könnte aber auch wegen unserem CMS nicht gehen):

        BODY.leer {
                    scrollbar-base-color: #000000;
                    scrollbar-track-color: #000000;
                    scrollbar-face-color: #000000;
                    scrollbar-highlight-color: #ffffff;
                    scrollbar-3d-light-color: #000000;
                    scrollbar-darkshadow-color: #000000;
                    scrollbar-shadow-color: #ffffff;
                    scrollbar-arrow-color: #ffffff;

        background-color: #ffffff;
          background-image: none;
          color: #000000;
          font-family: Arial,Helvetica,sans-serif;
          font-size: 10pt;
          font-weight: lighter;
          margin-left: 0px;
          margin-right: 0px;
          margin-top: 0px;
        }

        Danke nochmals

        Gruß

        MO

        1. Hallo Mo,

          Ich hatte nämlich noch ein Problem dazu. Dadurch, dass wir hier in der Firma so ein sündhaft teures Content-Management-System einsetzen, kann ich nicht einfach definitionen in den <head></head>
          schreiben, sondern muss alles in den Body-bereich schreiben.
          Aber da es eine JSP-Seite ist und diese ja auf dem Server übersetzt wird, funktioniert es auch, wenn ich es direkt nach dem <body> Tag reinschreibe.

          Damit handelst du dir aber potentiell wieder Ärger ein, weil <style> lt. HTML Deklaration nur im head erlaubt ist.  Im Moment stößt sich zwar glaube ich kein Browser daran, aber korrekt ist es nicht.

          Vielleicht finde ich noch eine elegantere Lösung.

          wäre schon gut, wenn du per CMS auch den <head></head> umschreiben könntest.

          Hast du noch eine Idee warum nachfolgende Lösung nicht funktioniert?
          (Zusätzliche Klasse zur normalen Body-Definition. Könnte aber auch wegen unserem CMS nicht gehen):

          BODY.leer {

          was steht denn im Quelltext der Seite, die der Browser zu sehen bekommt? <BODY class="leer">? Das sollte gehen.
          Bei Klassennamen ist Groß- und Kleinschreibung wichtig, bei XHTML müssen die Elementname klein geschrieben sein. <body class="leer">.

          Gruß Susanne

        2. Moin!

          Ich hatte nämlich noch ein Problem dazu. Dadurch, dass wir hier in der Firma so ein sündhaft teures Content-Management-System einsetzen, kann ich nicht einfach definitionen in den <head></head>
          schreiben, sondern muss alles in den Body-bereich schreiben.

          Du benutzt den VIP Content Manager von der Firma Gauss? Den kenne ich, den hasse ich, und ich kann nicht verstehen, dass das Teil immer noch gekauft wird.

          - Sven Rautenberg

          --
          "Bei einer Geschichte gibt es immer vier Seiten: Deine Seite, ihre Seite, die Wahrheit und das, was wirklich passiert ist." (Rousseau)
          1. Du benutzt den VIP Content Manager von der Firma Gauss?......»»

            Hallo

            Jo....ich hasse den auch. Würde viel lieber ohne den Arbeiten.
            Aber ich bin hier eingestellt worden und das komplette Intranet und Internet wird bereits damit gepflegt. Kann es also nicht einfach abändern. Aber ich arbeite daran...;-)

            Gruß

            MO

  3. Ich habe in meiner css-Datei ein fixes Hintergrundbild definiert, welches auf allen Seiten immer an genau der gleichen Position erscheinen soll. Funktioniert tadellos:

    BODY {

    [...]

    background: #ffffff;
      background-color: #ffffff;

    Doppelt gemoppelt.

    background-image: url("../Grafiken/allgemein/king.jpg");
      background-position: 100% 0%;
      background-repeat: no-repeat;

    [...]

    Nun möchte ich aber auf einigen wenigen Seiten, welche ich über Inline Frames einbinde, diese Grafik nicht haben.

    Dann schreibe in das 'head'-Element dieser Seiten:

    <style type="text/css">
      body {
         background-image: none;
      }
      </style>

    Oder vergebe dem 'body'-Element eine ID und deklariere 'background-image: none' entsprechend für 'body#bezeichner'.

    MI

    --
    : Michael Jendryschik : michael@jendryschik.de : http://jendryschik.de/ :
    : Einführung in XHTML, CSS und Webdesign   http://jendryschik.de/wsdev/ :
    : Monatlich das Beste aus de.alt.netdigest http://best-of-netdigest.de/ :
  4. hi,

    Per id ist schon der richtige Ansatz. In den <body>-tag darfst Du doch schreiben, oder? Wenn ja mach folgendes: Bei den iframe-seiten schreibst Du <body id="iframe"> und dann in die CSS Datei:

    BODY {[...Dein Kram...]}
    #iframe {background-image: none !important;}

    Die Reihenfolge könnte ausschlaggebend sein. Falls none mit bestimmten Browsern nicht geht (ausprobieren) musst Du ein leeres Bild benutzen, also:

    #iframe {background-image:uel(leer.gif) !important;}

    Näheres zu "!important" findest Du in SELFHTML.

    schö + schöne Grüsse
    stefan

    1. Näheres zu "!important" findest Du in SELFHTML.

      http://selfsuche.teamone.de/cgi-bin/such.pl?hits=alle&index_1=on&suchausdruck=important

      "kein Suchergebnis in 'SELFHTML V8.0'"

      http://www.w3.org/TR/CSS2/cascade.html#important-rules

      http://edition-w3c.de/TR/1998/REC-CSS2-19980512/kap06.html#heading-6.4.2�

      1. Hi

        http://selfsuche.teamone.de/cgi-bin/such.pl?hits=alle&index_1=on&suchausdruck=important

        "kein Suchergebnis in 'SELFHTML V8.0'"

        Oops, what a shame! ;)
        Das ist überigends garkein Link, lieber Linksetzer (oder sollte ich lieber "Linksetzer/Suchabfragenmeldungenzitierer" sagen?).

        schö stefan

        1. Das ist überigends garkein Link, lieber Linksetzer (oder sollte ich lieber "Linksetzer/Suchabfragenmeldungenzitierer" sagen?).

          Linksetzersuchabfragenmeldungenzitierenundunnötigesuchabfragenvermeider