V dnešním díle výukového seriálu si vysvětlíme, jak vložit do stránky obrázek a jak upravit jeho vlastnosti pomocí stylů.
V našem souboru o_firme.html, který je součástí složky http://www.zip/ (ke stažení), jsme v rámci minulé lekce zapsali dva odstavce textu. Do informací o firmě nyní přidáme obrázek. Obrázky musíme mít předem již připravené, tj. upravené pomocí grafického programu na požadovaný rozměr. Všechny obrázky pro náš web ukládáme do složky images, která je umístěna v naší složce se soubory internetové prezentace. Veškeré obrázky musí být ve formátu jpg, gif, nebo png a měly by mít co nejmenší velikost, aby se nestahovaly při načítání stránky příliš dlouho (limit není stanoven, doporučujeme pokud možno do 100 kB nebo ještě menší, pokud bude více obrázků na stránce).
Pro naše účely je připraven ve složce images obrázek s názvem pc_ucebna.jpg, má rozměry 350*263 bodů).
Tento obrázek nyní vložíme do zdrojového kódu stránky o_firme.html. Kurzor tedy umístíme na nový řádek za poslední dopsaný odstavec textu. V okně programu zvolíme záložku Multimédia a grafika a poté stiskneme označenou ikonu.
Otevřeme tím dialogové okno, pomocí kterého příslušný obrázek nalistujeme.
Do pole Alternativní text musíme dopsat text - je to povinný parametr obrázku. Ostatní parametry obrázku nebudeme vypisovat. Vytvořili jsme následující část zdrojového kódu:
<img src="pc_ucebna.jpg" mce_src="pc_ucebna.jpg" alt="Počítačová učebna" align="left" border="0">
Pokud nyní stiskneme klávesu F3, abychom si stránku mohli prohlédnout v prohlížeči, vidíme, že se obrázek nezobrazil. Musíme tedy zdrojový kód ručně upravit takto:
<img src="images/pc_ucebna.jpg" mce_src="images/pc_ucebna.jpg" alt="Počítačová učebna" align="left" …
