Cvičení č. 4

HTML – pokračování

• hypertextové odkazy, nastavení barvy textu hypertextového odkazu
• obrázky – rozdíl mezi formátem GIF a JPEG, atributy značky IMG
• obrázek jako pozadí webové stránky – výhody, nevýhody
• seznamy (číslované, nečíslované, definiční) a jejich vlastnosti

Samostatná práce

1. Na disku D: si vytvořte vlastní složku a v ní další dvě složky pojmenované WWW a OBRAZKY.
   
   
2. Kliknutím pravým tlačítkem myši na tento obrázek a následnou volbou příkazu Save Picture As... si uložte obrázek uklizecka.gif do složky OBRAZKY. Text uvedený vedle obrázku si v průběhu práce zkopírujte do svého dokumentu.
   
   

   Policie zadržela v Praze–Ruzyni dvě neznámé ženy podezřelé z přípravy
   teroristického útoku v odletové hale na letišti. Několik cestujících
   ohlásilo podezřelé chování dvou žen, které potřísnily podlahu v odletové
   hale neznámou tekutinou. Policejní ozbrojenci neprodyšně uzavřeli letiště
   a okolí. Několik expertiz vzorku látky nezávisle na sobě prokázalo, že se
   jedná o vodu se saponátem. Policie oběma ženám vrátila kýbly, smetáky
   i hadry, jež předtím zajistila, a propustila je na svobodu.
          

   
   
   
   
3. Vaším úkolem je vytvořit HTML stránku přesně podle následujícího vzoru. Stránku uložte pod názvem default.htm do složky WWW. Řiďte se následujícími pokyny:
   • Titulek stránky bude Úvodní stránka.
   • Pro strukturování dokumentu používejte nadpisy H1 a H2.
   • Oddělovací čára bude mít modrou barvu a délku 80 % šířky aktuálního okna.
   • Při vkládání obrázku uklizecka.gif použijte relativní cestu. Zajistěte (užitím atributu clear značky BR), aby nadpis Opakování vzorců vždy začínal až pod obrázkem.
   • V sekci Zajímavé odkazy vytvořte nečíslovaný seznam se třemi hypertextovými odkazy. První dva odkazy budou ukazovat na soubory pocasi.htm a zavislost.htm uložené ve složce WWW (viz dále). Při kliknutí na odkaz FAST VUT v Brně zajistěte (užitím atributu target značky A), aby se stránky Stavební fakulty automaticky otevřely v novém okně.
     
     
     
     
   
   
   
4. Vytvořte si další HTML stránku podle následujícího vzoru a uložte ji pod názvem pocasi.htm do složky WWW. Řiďte se následujícími pokyny:
   • Titulek stránky bude Počasí.
   • Obrázky, které budete vkládat, jsou umístěny na serveru Weather Underground. Při jejich vkládání použijte následující URL:
     Praha: http://banners.wunderground.com/banner/bigwx_metric_cond/language/czech/global/stations/11518.gif
     Brno: http://banners.wunderground.com/banner/bigwx_metric_cond/language/czech/global/stations/11723.gif
     Ostrava: http://banners.wunderground.com/banner/bigwx_metric_cond/language/czech/global/stations/11782.gif
     
   • Z každého obrázku poté udělejte hypertextový odkaz, prostřednictvím kterého bude možné zjistit podrobnější informace o počasí v daném městě. Tedy např. pro Prahu bude zdrojový kód vypadat následovně:

      <A href="http://czech.wunderground.com/global/stations/11518.html">
      <IMG src="http://banners.wunderground.com/banner/bigwx_metric_cond/language/czech/global/stations/11518.gif"
           alt="Předpověď počasí pro Prahu" border="0" height="60" width="468"></A>

   • Text Weather Underground na konci stránky bude hypertextovým odkazem na server http://czech.wunderground.com. Zajistěte, aby se stránky otevřely automaticky v novém okně.
   • Prostřednictvím hypertextového odkazu Zpět se uživatel dostane na úvodní stránku (tedy na soubor default.htm).
     
     
     
     
   
   
   
5. Vytvořte si poslední HTML stránku podle následujícího vzoru a uložte ji pod názvem zavislost.htm do složky WWW. Řiďte se následujícími pokyny:
   • Titulek stránky bude Závislost na Internetu.
   • Pro výčet příznaků použijte nečíslovaný seznam. Text ke zkopírování je uveden pod obrázkem.
   • Prostřednictvím hypertextového odkazu Zpět se uživatel dostane na úvodní stránku (tedy na soubor default.htm).
     
     
     
     

     Seznam příznaků závislosti na Internetu
     
     líbáte domácí stránku své dívky
     odmítáte odjet na dovolenou tam, kde není elektřina a telefon
     v noci se vám zdají sny v HTML
     při psaní čehokoliv píšete za každou větou .com
     při vypínání modemu máte podobný pocit, jako byste dostával kopačky
     všichni vaši přátelé mají ve jménu @
     nevíte, jakého pohlaví jsou vaši přátelé, mají neutrální přezdívky a vás nikdy nenapadlo se jich zeptat
     na stěnách veřejných záchodků hledáte webové adresy
     nikdy nemáte problémy s obsazenou linkou, protože se vůbec neodhlašujete
     vaše virtuální děvče si najde nového hocha s tlustším kabelem
     dívka, kterou jste naposledy sbalil, byla jenom JPEG

   
   
   
6. Otevřete si stránku www.brno.cz. Zjistěte URL on-line obrázku Malinovského náměstí. Tento obrázek si vložte na svou úvodní webovou stránku.
   
   

   ---

7. Pokud již máte vše hotovo, vytvořte si další HTML stránku s výčtem ročních období přesně podle následujícího vzoru. Názvy ročních období budou položkami číslovaného seznamu, názvy jednotlivých měsíců položkami vnořených nečíslovaných seznamů.