Autor Zpráva
Vašek
Profil *
Dobrý den, prosím opět o radu pro začátečníka. Chci dát nahoru na stránku panoramatický obrázek tak, aby byl přesně přes celou šířku plochy při rozlišení 1024x748. Při šířce obrázku 1024 se mi ale stránka roztáhne do šířky - musí se posouvat posuvníkem. Nahoře a na bocích jsou vidět proužky pozadí. Když zmenším šířku obrázku, posuvník zmizí, ale zvětší se okraje z pozadí na bocích. Poraďte mi prosím, jak vložit obrázek tak, aby byl umístněn přes celou šířku plochy a začínal úplně nahoře.
Předem děkuji za rady.
none
Profil
<img border="0" src="obrázek.gif" width="100%" height="100%">
Vašek
Profil *
none díky, ale když jsem to zkusil, obrázek se jen roztáhl směrem doků do půlky stránky, šířka zůstala, okraje zůstaly. Já to už zkoušel všelijak s border, do tabulky... ane a ne.
Pachollini
Profil
Zkus ho dát na pozadí nějakého prvku, třeba přímo <body>, tedy přidat do CSS:

body{background: url("obrazek.gif") left top no-repeat;}

Pokud chceš, aby se centroval, vynech to "left".
Vašek
Profil *
Taky to nefunguje- nezobrazí se nic valstě se zobrazí tagy. Nevím proč CSS neovládám a html jen torchu.
A Kdyby to fungovalo, jak bych tam dal to pozadí, které tam mám teď?
Pachollini
Profil
> valstě se zobrazí tagy
Tomu nerozumím, zkus poslat adresu té stránky.
Pokud tam máš ještě nějaké pozadí, můžeš ho vložit to jiného prvku (anebo do jiného prvku vložit ten panoramatický obrázek).
Vašek
Profil *
Zobrazí se místo obrázku: body{background: url("obrazek.gif") left top no-repeat;}
Adresa té stránky není, zatím to ladím v počítači. Pokud by někdo chtěl pomoct, mohu mu mailem poslat html soubor a ten nešťastný obrázek.
Vašek
Profil *
Pro zjednodušení jsem to uložil na http://zdenag.sweb.cz/test.html Je to jen pracovní verze ale potřeboval bych takový obrázek dát od shora stránky a bez okrajů přes plochu.
Děkuji všem za případné rady.
AMD
Profil

Zobrazí se místo obrázku: body{background: url("obrazek.gif") left top no-repeat;}

Páč to píšeš do HTML, musíš udělat soubor s CSS, třeba: style.css, do <head>
<link href="style.css" rel="StyleSheet" type="text/css" />

A do toho CSS (můžeš změnit příp. na .txt a pak zase zpátky) napsat
body {

background: url('obrazek.gif') left top no-repeat;
}

btw, samozřejmě obrazek.gif nahradíš tím svým ;)
AMD
Profil
a ještě do CSS přidej
img {

border: none;
}

a pak můžeš dát u všech obrázků pryč border="0"
TIP: nepoužívej BMP
Vašek
Profil *
AMD děkuji za radu ale nějak mi to nepálí. O css vím jen, že existuje a kdysi jsem se zde ptal, jestli jde kombinovat html s css a bylo mi odpovězeno že ano.
Zkrátka nevím, co stím. Jestli můžeš napsat kousek zdrojáku
Vašek
Profil *
Tak už se mi to povedlo. Obrázek je OK ale ostatní prvky stránky se posunuly logicky nahoru přes tu fotku, která je jako pozadí a původní pozadí zmizelo. Jak dál?
mila
Profil
Přidej do toho css ještě
padding-top:xxx px
kde xxx je výška obrázku.
Jinak je asi zbytečný, kvuli tomuto vytvářet soubor css.
Asi nejlepší by bylo
<body style="background: url('obrazek.gif') left top no-repeat; padding-top:xxx px">

Ty posuvníky se asi objevily, neboť vlastní okno je užší než oněch 1024.
Vašek
Profil *
Díky ale pořád to není ono. Ostatní prvky stránky pořád trochu překrývají ten obrázek a nemůžu je dostat níž a také jak dát na zbytek stránky to původní pozadí?
mila
Profil
Pokud se to stále trochu překrývá, tak ten padding o něco zvyš.
S původním pozadí by neměl být problém.

<body style="margin: 0; background: url('pozadi.gif')">
<div style="background: url('obrazek.gif') center top no-repeat; padding-top:xxx px>
.....
........
</div>
</body>

Ten margin zařídí, aby obrázek začínal hned v rohu.

Jinak se podívej na návod na css na těchto stránkách, není to vůbec složité.
Toto by mělo fungovat, prakticky stejně to mám na http://hadanky.chytrak.cz
Vašek
Profil *
Dííííííky! Je to ok. Musím se na css podívat až bude čas. Nerad dělám něco, když nevím proč a jak to funguje.
Ještě jednou dík.
mila
Profil
Margin je místo, které si blok nechává kolem sebe. Padding je vnitřní okraj, aby se obsah nelepil na okraje. To pozadí asi jasné..
<div> je neutrální prvek, který se neprojeví, pokud mu nepřiřadíš nějaký styl.
Toto téma je uzamčeno. Odpověď nelze zaslat.