Background in HTML strecken

Buri

gesperrt
Hi

Ist es möglich das bg bild in einem HTML Dokument zu strecken ???

Standartgemäss ist es ja immer gekachelt und das sieht mist aus !!!

Bitte hilfe !!!
 
Hi Daishi

kannste über *.css machen

sieht dann so aus
Code:
.test { [COLOR=silver]<-- name der css[/COLOR] 
	background-attachment: fixed; [COLOR=silver]<-- nicht wiederholen/kacheln[/COLOR] 
	background-image: url(xxx.png);    [COLOR=silver]<-- BG Bield[/COLOR] 
	background-repeat: no-repeat;  [COLOR=silver]<--  scrollt nicht mit[/COLOR]   
	//background-position: 100% 100%; [COLOR=silver]<-- strecken auf 100% (würd ich nicht tun)[/COLOR] 
         background-position: center center; [COLOR=silver]<-- mitte [/COLOR]  
         background-color: #000000; [COLOR=silver]<-- bg farbe[/COLOR] 
         left: 50px; [COLOR=silver]<-- abstand links[/COLOR] 
	top: 50px; [COLOR=silver]<-- abstand oben[/COLOR] 
}

oder in der html datei

Code:
<body bgcolor="#xxxxxx" background="images.jpg" text="#xxxxxx" link="#xxxxxx" vlink="#xxxxxx" alink="#xxxxxx" 
leftmargin="50" topmargin="50" bgproperties="fixed" style="Background-Image: images.jpg); Background-Repeat: no-repeat; 
background-position:center; background-position:top;">

hier bleibt das bild in der mitte mit einem abstand von 50 (links und oben) und wiederholt sich nicht (kacheln) und scrollt nicht mit (fest also)



ich hoffe eine version kannste gebrauchen
 
Zuletzt bearbeitet:
Strecken kannst Du ein Hintergrundbild, meines wissens nicht.

Aber Du kannst per CSS das Kacheln unterbinden.

body {Background-Image: url(hinter.gif);
Background-Repeat: no-repeat; }

#Edit:
Ups, Netzhai war schneller :angel
 
Hallo,
Ich hätte gerne auf meiner seite eine zentrierung ( Die seite immer inner mitte)
und dazu ein globales back ground, damitwen jemand nen gröseren bildschrim hat es keine weißen stellen gibt.

Das Problem ist,das ich ein noop bin und nicht weis wie man dies mit html erreichen kann : ( .
 
Erst einmal herzlich Willkommen im Forum!
Setz Dich auf's Boardsofa und mach es Dir gemütlich.

Nun zu Deinem Problem:
Das Problem lässt sich mittels CSS lösen. Es stellt sich lediglich die Frage, was Du zentrieren willst:

  • Den Text auf der Webseite?
  • Einen Block mit dem gesamten Inhalt (außer dem Hintergrundbild), bei dem die Ränder rechts und links immer gleich breit sein sollen?
  • Soll der Inhaltsblock eine feste Breite haben (nicht wirklich empfehlenswert, da immer mehr Breitbildschirme in Gebrauch sind) oder soll er sich der Bildschirmgröße anpassen?
  • Soll der Hintergrund mitscrollen oder stehen bleiben?
  • Darf der Hintergrund kacheln, oder soll es nur ein Bild sein, welches nicht wiederholt wird?
  • ...
Wenn Du das noch schreiben könntest, wäre es wesentlich einfacher, eine Antwort zu geben.

PS: Dem "Noob"-Zustand lässt sich mit dieser Seite und dieser Seite sehr schnell abhelfen, die sind einfach und verständlich geschrieben und helfen, direkt von Anfang an grobe Fehler zu vermeiden. Wenn es dann ein wenig weiter "ins Eingemachte" gehen soll ist natürlich "die HTML Bibel" auch immer wieder einen Blick wert, bevor man sich wirklich hardcore mäßig auf diese Seiten (engl) stürzt ;)
 
Zuletzt bearbeitet:
Hallo also folgendes, die webseite besteht ja aus banner dan buttons und dem "schreibfeld"

Das muster:
-----------------------------------------------
I
I Banner
I
-----------------------------------------------

-----------------------------------------------
Buttons
-----------------------------------------------

-----------------------------------------------



Schreibfeld



-----------------------------------------------

Der backgroun ist schwarz und mit scanlines durchzogen \ <--- solche halt übern ganzen background verteilt.

Die drei ebenen der seie (Banner,Buttons,Schreibfeld) sollen immer in der mitte des browsers sein,und der background soll dan halt die weißen stellen füllen.

@ offtopic
Danke fürs wilkommen heisen!
 
Guten Tag,

Ich weiß dieser Thread is zwar schon älter, aber ich hab eine lösung dafür!

HTML:
<html>
<head>
</head>
<body bgcolor="#DDDDDD" text="red" marginheight=0 marginwidth=0 topmargin=0 leftmargin=0>
<img src="Pfad/zum/Hintergrundbild.jpg" height=100% width=100%>
<div style="position:absolute; left:0; top:0">

<!-- hier kommt der eigentliche Inhalt hin!
Und schon habt Ihr ein gestrecktes Hintergrundbild!
Wichtig ist das der Text zwichen den Div-Tag's steht!//-->

</div>
</body>
</html>

Ich hoffe dies wird euch helfen!

MfG.: Minimuecke
ps: ich bin dann mal :weg
 
Das macht das Hintergrundbild nur so hoch und breit wie den Vieport ist und fixiert es nicht. Sobald der Inhalt im DIV so lang wird, dass er nicht mehr auf einen Bildschirm passt, und man scrollen muss, scrollt das Hintergrundbild mit.
wenn man das ein klein wenig ändert, sollte das aber dennoch hin zu bekommen sein:

HTML:
<div style="position:fixed;top:0;left:0;z-index:0;">
<img src="Pfad/zum/Hintergrundbild.jpg" height="100%" width="100%">
</div>
<div style="position:absolute;top:0;left:0;z-index:3;">Hier der Inhalt</div>

Oder wie einen Beitrag weiter oben erwähnt + fest definierter Höhe und Breite für das DIV sowie overflow:scroll; - gibt aber hässliche Scrollbalken in der Seite wie bei Frameseiten ...

Oder alternativ mit Hilfe von ein paar Zeilen JavaScript, da manche Versionen des IE Probleme mit position:fixed haben.
 
Das macht das Hintergrundbild nur so hoch und breit wie der Vieport ist und fixiert es nicht. Sobald der Inhalt im DIV so lang wird, dass er nicht mehr auf einen Bildschirm passt, und man scrollen muss, scrollt das Hintergrundbild mit.
wenn man das ein klein wenig ändert, sollte das aber dennoch hin zu bekommen sein:

HTML:
<div style="position:fixed;top:0;left:0;z-index:0;">
<img src="Pfad/zum/Hintergrundbild.jpg" height="100%" width="100%">
</div>
<div style="position:absolute;top:0;left:0;z-index:3;">Hier der Inhalt</div>

Oder alternativ ein post weiter oben + fest definierter Höhe und Breite für das DIV sowie overflow:scroll ...

Oder alternativ mit Hilfe von ein paar Zeilen JavaScript, da der IE manchmal Probleme mit position:fixed hat.

Es gibt jedoch ein problem:
Der Text lässt sich nichtmehr ausrichten!
Aber es war wenigstens schonmal ein kleiner ansatz.
Trotzdem danke!
 
Zuletzt bearbeitet:
Wieso? In dem Div kann man doch alle Elemente so ausrichten wie man Spaß daran hat... :unsure:

nachdem man das mit dem Hintergrundbild drinne hat lässt sich der Text nichtmehr ausrichten...
zumindestens nicht bei mir!
es funktioniert auf jeden fall dann nichtmehr...
egal ob ich das in einer tabelle setze oder im DIV-Tag setze!

MfG.:
Minimuecke
 
Oben