Schopnosti značkovacího jazyka - HTML - a kaskádové šablony stylů - CSS - vám umožňují umístit jeden obrázek do jiného mnoha způsoby. To samozřejmě vyžaduje určité dovednosti v rozložení webové stránky a je třeba zvolit konkrétní metodu založenou na existujícím kódu. V některých případech se však můžete obejít bez úpravy zdrojového kódu.
Instrukce
Krok 1
Existuje způsob, jak umístit jeden obrázek do jiného bez jakýchkoli změn na stránkách webu. K tomu stačí upravit obrázek na pozadí uložený na serveru - pomocí libovolného grafického editoru na něj umístit obrázek v popředí. Pokud tato metoda funguje pro vás, začněte definováním umístění úložiště a názvu souboru obrázku na pozadí. To lze provést vyhledáním ve zdrojovém kódu stránky nebo otevřením na samostatné kartě a prohlédnutím celé cesty v adresním řádku prohlížeče.
Krok 2
Pomocí správce souborů systému pro správu obsahu nebo klienta FTP stáhněte požadovaný soubor do počítače a otevřete jej v libovolném grafickém editoru - například v aplikaci Malování nainstalované ve Windows.
Krok 3
Umístěte obrázek v popředí na pozadí - v aplikaci Malování k tomu musíte vybrat položku „Vložit z“z rozevíracího seznamu „Vložit“na kartě „Domů“a v dialogu, který se otevře, najít požadovaný soubor. Poté upravte polohu vloženého obrázku na stávajícím pozadí (přetáhněte jej myší) a uložte výsledek (Ctrl + S).
Krok 4
Načíst zpět upravený obrázek a přepsat starý. Tím je postup dokončen.
Krok 5
Popsaná metoda je nepohodlná v případě, kdy je třeba vložené obrázky čas od času změnit. Poté použijte možnosti jazyka HTML - například udělejte z obrázku na pozadí pozadí prvku stránky, do kterého bude obrázek v popředí umístěn. Takovýmto kontejnerovým prvkem může být například vrstva (div). Chcete-li, aby velká část obrázků byla na pozadí, musíte použít popis stylu - atribut stylu tagu div. Prázdný kontejner v kódu HTML může vypadat takto:
V závorkách uveďte adresu a název souboru obrázku pozadí na vašem webu.
Krok 6
Vytvořte značku obrázku v popředí (img) pomocí stejného atributu stylu k nastavení množství výplně od okrajů kontejneru na pozadí. Například:
Zde atributy šířky a výšky nastavují rozměry obrázku a čtyři čísla za výplní označují výplň v pixelech od okrajů kontejneru, počínaje nahoře (50) a dále ve směru hodinových ručiček (60 - vpravo, 70 - dole, 80 - vlevo).
Krok 7
Umístěte značku img do kontejneru:
Krok 8
Přidejte vytvořené řádky do zdrojového kódu stránky a poté změnou odsazení upravte polohu vloženého obrázku na pozadí obrázku na pozadí.
