kostenloser Webspace werbefrei: lima-city

Bilder per CSS setzen

lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript

1. Autor dieses Themas

   freshfire

   freshfire hat kostenlosen Webspace.

   22:23, 6.3.2014

   Hi,
   
   ich hab gerade geistig einen Hänger
   
   Ich möchte in meiner div id Hindergrundtag/bild">bild mit Fahrverlauf setzten und noch rechts oben ein Logo.
   
   Leider geht das ja nicht
   
   background: url(images/header_bg.gif);
   background: url(images/header.gif) no-repeat right top;
   
   wie kann ich das auflösen das er doch geht?

2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

3. lucasgeorg

   lucasgeorg hat kostenlosen Webspace.

   1:05, 7.3.2014

   Gebe im style des div´s explizit die auflösung des Hintergrundbildes an also zb. with:1600px; height:1200px; dann zwingst du das objekt so gross wie das Bild zu sein egal ob der div-tag noch nen html-content hat...für dein Logo oben rechts empfehle ich dir position auf fixed dann unter left etwa 90 - 95%...mit top kannst du in px noch ein offset vom oberen seitenrand angeben...beim scrollend bewirkt das fixed unter position dass das logo immer im Sichtfeld bleibt...natürlich besonders hübsch wenn deine logo datei einen Alphakanal hat. Geholfen?

4. mein-wunschname

   mein-wunschname hat kostenlosen Webspace.

   10:15, 7.3.2014

   Wenn ein und das selbe HTML-Element mehrere Hintergrundbilder haben soll, dann muss man diese durch Komma voneinander trennen, ebenso die weiteren Eigenschaften des HG-Bildes. Das kann dann z.B. so aussehen:
   

   #wrapper     { 
   width: 950px; 
   font-family: Tahoma; 
   margin-left: auto; 
   margin-right: auto; 
   background-image:url('images/aufz2.gif'), url('images/logo-01.png'); 
   background-position: center, right top;
   background-repeat:repeat, no-repeat;
   }

   
   
   Die Grafik aufz2.gif wird im ganzen div-Bereich wiederholt, die Grafik logo-01.png wird nur 1 Mal rechts oben in der Ecke des div-Bereiches angezeigt.
   
   Da diese Multibackground-Fähigkeit erst mit CSS3 verfügbar ist und nicht alle Browser alle CSS3-Möglichkeiten gleichermaßen unterstützen, kann ich nicht sagen, ob das bei allen Browseern ankommt, bei Chrome 33 und FF 26 klappt es auf jeden Fall.
   
   Ansonsten kann man natürlich auch die alte Methode ineinander verschachtelter, teilweise dann positionierter Divs verwenden.
5. Autor dieses Themas

   freshfire

   freshfire hat kostenlosen Webspace.

   11:13, 7.3.2014

   Ok ...
   
   ... das mach ich lieber die alte Schachtelung
   
   

   #header {
   	background: url(images/header_bg.gif);
   	height: 90px;
   }
   
   .header{ 
   	background: url('images/header.gif') no-repeat right top;
   	height: 90px;
   }

   
   
   Mit ID und Class
   
   

6. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?