Cvičení č. 3

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 H: si ve svojí složce HTML vytvořte další složku pojmenovanou WWW.

  2. Kliknutím pravým tlačítkem myši na tento obrázek a následnou volbou příkazu Ulož obrázek jako... (Save Picture As...) si uložte obrázek uklizecka.gif do složky WWW. 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ě. Webové stránky FAST VUT v Brně mají URL http://www.fce.vutbr.cz.





  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ů.