|
|
|
|
|
bild einfügen
|
Hallo,
ich würde gerne wissen wie man bei meienr HP ein backround image einfügen kann.
wie z.B. hier:
http://sprotten.ebytenet.com/portal.php (nicht von LOTRO abschrecken lassen dur beispiel )
http://sprotten.ebytenet.com/styles/prosilver/theme/images/background.jpg
1.) wie muss ich das ganze einbinden?
in die index.php in den body bereich?
2.) im beispiel ist der hintergrund nur an den seiten und in der mitte weiß (da wo die site ist). wie kann ich mir den hintergrund so bauen das die weiße stelle überdeckt wird? jeder hat ja eine andere auflösen, wird das automatisch umgerechnet?
|
|
|
|
|
|
|
|
|
|
|
Das ganze ist mit CSS zu bewerkstelligen. Um genauer zu sein, mit der background Eigenschaft. Diese fuegt einem HTML Element einen Hintergrund so wie zb ein Bild zu. Bilder werden Standardmaessig vertikal und horizontal wiederhohlt.
Wenn ich zb fuer meine Ganze Seite gerne ein bestimmtes bild als Hintergrund haette wuerde das zb so gehen:
body {background: url(meinBild.png)}
Fuer die background Eigenschaft wird ein bild also mit url([pfad zum Bil]) (ohne [ ]) angegeben.
Was der Designer der Webseite aus deinem beispiel gemacht haben wird ist ein Hintergrundbild in dem das Weiss so breit ist wie er den Innhalt via CSS definiert hat.
Sein CSS fuer den Hintergrund sieht im ganzen ca so aus:
body
{
background: url(hintergrund.png) no-repeat center black;
}
url()
fuer das Bild selber
no-repeat
damit sich das Bild nicht vertikal/horizontal wiederholt
center
damit es in der Mitte der seite erscheint (der Inhalt erscheint auch mittig und deckt so dynamisch das Weisse im Hintergrund ab.
black
die Hintergrundfarbe die zu sehen ist sollte jemand einen Bildschirm haben der breiter ist als das Bild.
|
|
|
|
|
|
|
|
|
|
danke für die gute erklärung!
im moment sieht es in der index.php so aus:
| |
| Code: |
...
body {
background-repeat: repeat-x;
background-color: #000000;
} |
|
soll das ganze also da rein?
also dann so?
| |
| Code: |
body {
background: url(back.jpg) no-repeat center black;
background-color: #000000;
}
|
|
funktioniert das ganze dann auch? ich benutze webspell.
hier die seite:
http://maniacmonkeys.ma.funpic.de/
(also da wo es schwarz ist an den seiten ein bild)
ie kann ich das "innere" ausmessen? (mit lineal? )
|
|
[Dieser Beitrag wurde 1 mal editiert; zum letzten Mal von PotBot am 28.07.2009 12:53]
|
|
|
|
|
|
|
|
|
Kannst zB Firebug benutzen, aber in deinem Fall willste wahrscheinlich eh die schwarzen Ränder abgedeckt haben oder?
Also einfach body { background: #000 url('back.jpg') repeat-x}
|
|
|
|
|
|
|
|
|
|
|
| | Zitat von PotBot
ie kann ich das "innere" ausmessen? (mit lineal?)
| |
Entweder so (die Web Developer Toolbar fuer Firefox hat eins), oder mit den Layout Details in Firebug.
Deine Inhalt (die Tabelle in der Mitte) ist scheinbar 1000px breit 
|
|
[Dieser Beitrag wurde 1 mal editiert; zum letzten Mal von Y2Keeper am 28.07.2009 14:52]
|
|
|
|
|
|
|
|
|
ok danke für die antworten.
jetzt geht es aber weiter:
kann mir jemand sagen wie man diese "models" auf den bildern nennt bzw. wo man solche bilder her bekommt? (ich will nicht solche models sondern solche bilder mit der struktur)
http://s1.directupload.net/file/d/1869/bw63nagw_jpg.htm
viell. kann mir auch jmd. einen hintergrund bauen (ich würde es auch machen wenn keiner lust hat, aber ich habe "nur" gimp). es sollte ungefähr so aussehen: oben links und rechts ct/t (mit struktur). nur oberkörper oder alles. und unten links und rechts ct/t in duckender position bzw. typischer position mit waffe.
wenn es zu überladen wäre oder ihr bessere vorschläge habt schreibt es einfach.
|
|
|
|
|
|
|
|
|
|
|
|
Da bist du glaube ich besser im GFX Forum aufgehoben.
|
|
|
|
|
|
|
|
|
|
|
ok werd ich machen. wenn es soweit ist unnd ich noch probleme mit dem code habe melde ich mich hier nochmal.
Danke für alle antworten!
|
|
|
|
|
|
|
|
|
|
|
hallo,
ich habe das problem das sich die ganze seite verändert. sprich das design wird total verrückt. (text wird größer, text nicht mehr auf textfeldern)
ich habe auch gemerkt, dass das hintergrundbild nicht sepperat geladen wird, sondern wie ein teil des ganzen designs ist. im oben genannten beispiel bewegt sich der hintergrund auch nicht mit der tabelle mit, sondern bleibt immer starr. (möchte ich am besten auch so haben)
gibt es dafür evtl. einen anderen code?
|
|
|
|
|
|
|
|
|
|
|
um ein Hintergrund zu "fixieren":
| |
| Code: |
background-attachment:fixed
|
|
|
|
|
|
|
|
|
|
|
|
|
danke das mit dme fixieren hat funktioniert.
nur besteht immernoch das problem, dass sich die ganze schrift usw. verschiebt. (alles wird größer)
kann man es irgendwie einstellen, dass der hintergrund praktisch unabhängig vom rest ist?
|
|
|
|
|
|
|
|
| Thema: HP backround ( bild einfügen ) |
