1 Provázání stránek Vytvořte dvě www stránky, jednu růžovou a druhou modrou – viz. zdrojové kódy RŮŽOVÁ STRÁNKA Růžová stránka Odkaz na modrou stránku.

Prezentace na téma: "1 Provázání stránek Vytvořte dvě www stránky, jednu růžovou a druhou modrou – viz. zdrojové kódy RŮŽOVÁ STRÁNKA Růžová stránka Odkaz na modrou stránku."— Transkript prezentace:

1 1 Provázání stránek Vytvořte dvě www stránky, jednu růžovou a druhou modrou – viz. zdrojové kódy RŮŽOVÁ STRÁNKA Růžová stránka Odkaz na modrou stránku MODRÁ STRÁNKA Modrá stránka Odkaz na růžovou stránku

2 2 Provázání stránek Obě stránky uložte do společné složky. Název stránky bude wwwr.html (růžová stránka) a wwwm.html (modrá stránka). A nyní doplňte do zdrojových kódů odkazy. Růžová stránka Odkaz na modrou stránku Modrá stránka Odkaz na růžovou stránku

3 3 Provázání stránek Vyzkoušejte funkčnost odkazů. Jistě jste si všimli zabarvení odkazů v prohlížeči. Barvu odkazů na stránce můžeme změnit v tagu BODY pomocí parametru: link="barva" - pro nenavštívený odkaz vlink="barva" – pro navštívený odkaz alink="barva" – pro aktivní odkaz

4 4 Provázání stránek A nyní doplňte zdrojové kódy tak, aby odkazy měly barvu textu stránky. Například pro modrou stránku bude úprava následující: Modrá stránka

5 5 Provázání stránek Teď si zopakujeme práci s obrázky. Soubor "zima.jpg" upravte pro monitory s rozlišením 800x600 pixelů, neměňte proporcionalitu. Dále vytvořte náhledový obrázek velikosti 120x? pixelů, zmenšení obrázku bude proporcionální.

6 6 Provázání stránek Ke správné funkci vašeho webu nezapomeňte dodržet organizační pravidla. Oba upravené obrázky uložte do složky " obr ". Obrázky pojmenujte dle náhledu a pomocí komprese upravte i jejich velikost.

7 7 Provázání stránek Nyní vložíme do modré stránky náhledový obrázek. Jistě jste si všimli efektu zarovnání pomocí značky DIV. Modrá stránka Odkaz na růžovou stránku <IMG src="obr/zima1_m.jpg" width="100" heiht="69" alt="Pracejovice v zimě">

8 8 Provázání stránek Přidáme odkaz. Velký obrázek se otevře v novém okně prohlížeče. Nezapomeňte do popisku uvést velikost stahovaného obrázku. Odkaz na růžovou stránku <IMG src="obr/zima1_m.jpg" width="100" heiht="69" alt="Pracejovice v zimě vel 25 kB">

9 9 Provázání stránek Na závěr se pokuste upravit zdrojový kód tak, aby výsledek v prohlížeči byl obdobný. Použijte jinou hodnotu parametru target. Popis obrázku alt zrušte a volte jinou možnost.