Autor Zpráva
Novy
Profil
Chtěl bych dát na web obrázek na pozadí
body{
background: #FFFFFF url(images/bg.png) no-repeat;
ale když stránku oddálím, tak tak vpravo od obrázku se objeví bílá plocha nebo když ji přiblížím tak část obrázku zmizí, jak udělat aby byl pořád přes celou stránku? Aby se roztáhnul. (jen na šířku)
Sir Tom
Profil
Novy:
Existuje CSS vlastnost background-size, ale ta je tak "nová", že ještě není pořádně zavedená, že lepší je použití obrázku <img>.
Hned za <body> dáš <img src="cestakObrazku.jpg" class="pozadi" /> a v CSS:
.pozadi {
 position: absolute;
 top: 0px;
 left: 0px;
 width: 100%;
 height: 100%;
}
jenikkozak
Profil
Novy:
Jen doplním, co napsal Sir Tom:
- Má-li se obrázek roztahovat jen našířku, deklaraci výšky odmaž.
- Je třeba myslet na to, že position: absolute vytáhne obrázek z toku dokumentu. Aby se umístil do pozadí, hodí se nastavit pozicování i zbylému obsahu. (Ideálně obalením zbytku prvků do jednoho elementu.)
- Pokud prvku <body> nevynuluješ okraje, bude se ti v některých prohlížečích (FF, Chrome) zobrazovat spodní posuvník v případě, že budeš pracovat quirku. V opačném případě se budou zobrazovat všude.
Sir Tom
Profil
jenikkozak:
Má-li se obrázek roztahovat jen našířku, deklaraci výšky odmaž.
Aha, špatně jsem si přečetl zadání.

Aby se umístil do pozadí, hodí se nastavit pozicování i zbylému obsahu.
Právě proto, že position: absolute vytahuje obsah z toku, myslím, že není nutné další obsah dále pozicovat - nechá se prostě "téct" tak jak má. (V tomto aktuálním případě - jinde by pochopitelně by se obsah do něčeho obalil.) Proto jsem také napsal, že by to <img> mělo být hned za <body>, aby bylo první (čili nejvíce vzadu) a bylo vykresleno dříve než obsah.

S dalšími připomínkami souhlasím - toto vše si bude muset Novy ošetřit sám stylem pokus-omyl.
jenikkozak
Profil
Sir Tom:
Proto jsem také napsal, že by to <img> mělo být hned za <body>, aby bylo první (čili nejvíce vzadu) a bylo vykresleno dříve než obsah.
Vzhledem k tomu, že by jako jediný prvek mělo nastaveno position:absolute, nezáleželo by na tom, kde v kódu bude umístěno, zobrazovalo by se v popředí.

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm:

0