XHTML – obrázky Mgr. Lenka Švancarová Autorem materiálu a všech jeho částí, není-li uvedeno jinak, je Mgr. Lenka Švancarová. Dostupné z Metodického portálu.

Prezentace na téma: "XHTML – obrázky Mgr. Lenka Švancarová Autorem materiálu a všech jeho částí, není-li uvedeno jinak, je Mgr. Lenka Švancarová. Dostupné z Metodického portálu."— Transkript prezentace:

1 XHTML – obrázky Mgr. Lenka Švancarová Autorem materiálu a všech jeho částí, není-li uvedeno jinak, je Mgr. Lenka Švancarová. Dostupné z Metodického portálu www.rvp.cz, ISSN: 1802-4785. Provozuje Národní ústav pro vzdělávání, školské poradenské zařízení a zařízení pro další vzdělávání pedagogických pracovníků (NÚV).

2 XHTML – obrázky Nepárová značka img. Značka má dva povinné atributy.  src – specifikuje adresu obrázku. obr.jpg pokud je obrázek ve stejné složce jako stránka v níž je použit, obecně relativní adresa k souboru. Pomocí URL lze odkazovat i na obrázek umístěný na Internetu. Pokud se nejedná o vaše úložiště dat nevhodné.  alt – definuje popisek obrázku, který se zobrazuje v textovém prohlížeči (nevidomí) nebo při nenačtení obrázku.

3 XHTML – obrázky Dva nepovinné atributy určující rozměry obrázku, které doporučuji vždy uvádět.  height – definuje výšku obrázku.  width – definuje šířku obrázku. Oba atributy lze zadávat buď v pixelech (150, přesněji 150px) nebo v procentech (100%).

4 XHTML – obrázky Značku lze vložit i přetažením obrázku myší na požadované místo do kódu. Vygenerovanou značku je nutné upravit.

5 XHTML – obrázky Další užívané nepovinné atributy:  align – specifikuje, jak bude okolní text obtékat obrázek. Hodnoty: left, right, top, bottom, middle  title – tvoří popisek při najetí kurzorem myši na obrázek.

6 XHTML – obrázky <img src= "OBR/0. GIF" alt="0" height="120" width="80" align="left" /> Lorem ipsum dolor sit amet consectetuer In tortor Lorem urna ipsum. Id amet wisi sit.

7 XHTML – Klikací mapa obrázku <img src="PLUS.GIF" alt="PLUS" usemap="#ctverecky" title="PLUS" height="86" width="85" />

8 XHTML – obrázky V PSPadu si otevři soubor komponenta.html.  Do dokumentu vlož alespoň tři textové odkazy na WWW stránky týkající se této komponenty.  Do stránky vlož obrázky počítačové komponenty.  Alespoň jeden obrázek bude obtékán textem.  Většina obrázků bude zároveň i odkaz na stránku, z které byl získán.

9 XHTML – obrázky Dle materiálů na stránce http://www.jakpsatweb.cz/html/obrazky.html#map vytvoř soubor mapa.html, kde bude umístěn obrázek, jehož každý roh bude odkazovat na jinou stránku. http://www.jakpsatweb.cz/html/obrazky.html#map Do sešitu si zapiš značky map, area a jejich atributy (včetně popisu hodnot) a atribut usemap značky img.

10 Doporučená literatura Programování na Webu – Miroslav Kučera, Jiří Peterka a kolektiv http://www.jakpsatweb.cz/html/odkazy.html http://www.jakpsatweb.cz/html/obrazky.html# map http://www.jakpsatweb.cz/html/obrazky.html# map http://www.w3schools.com/tags/tag_img.asp