Jak vložit obrázek do HTML na vašem webu

10. 3. 2020

Přidání obrázků na vaše webové stránky nebo profil sociální sítě je skvělý způsob, jak zdobit svou stránku. HTML (Hypertext Markup Language) se vyznačuje velkým počtem funkcí pro vývoj webových aplikací a kód potřebný k přidání obrázků je poměrně jednoduchý.

jak vložit obrázek do html

Jak vložit obrázek do HTML?

Nahrajte svůj obrázek na bezplatnou webovou stránku pro hostování obrázků, například Photobucket nebo TinyPic, která poskytuje stažený přístup ke staženému souboru. Po kopírování odkazu na obrázek se objeví přímo na webu hostingu. Pokud však platíte za prémiové služby takové služby, je lepší použít další funkce. To je spolehlivější, protože ve volném hostování obrázků se někdy neotvírají obrázky kvůli přetížení. Po načtení obrázku do některé z online služeb otevřete nový dokument v počítači v textovém editoru (například v programu Poznámkový blok) nebo přejděte na panel úprav požadované stránky vašeho webu (kde můžete změnit kód HTML).

html, jak vložit obrázek

Psaní štítků

Pokračujte v diskusi o vložení obrázku do HTML, začněte značkou IMG. Po jejím přidání musíte před zavřením znaku přidat mezeru a lomítko. Musíte tedy vytočit následující kombinaci - <img />. Kromě toho je k dispozici mnoho atributů, ale pouze jedna z nich je naprosto nezbytná. Toto je adresa nebo adresa vašeho obrázku. Zadává se takto - <img src = "URL_ obrázku" />.

Alternativní text

Dále se pokusíte vložit obrázek do HTML, musíte přidat atribut Alt. Toto definuje alternativní text v případě, že se obraz nezaváhne. Takový text je určen také pro zrakově postižené uživatele, kteří používají čtečky obrazovky. Pokud se vznášíte kurzor myši na obrázku se v popisku objeví alternativní text, ale tato funkce je k dispozici pouze v aplikaci Internet Explorer. Chcete-li ji vidět v jiných aplikacích, budete potřebovat speciální pluginy. Chcete-li zadat takový nástrojový popis, zadejte jej vedle Alt. (Tento krok můžete volitelně přeskočit. Používáte-li tuto funkci, odkaz bude vypadat takto:

<img src = "URL_your_article" alt = "Pop-up_text" "title =" Nápověda "/>

vložit obrázek do html

Velikost a parametry obrázku

Pokračujte podle pokynů pro vkládání obrázku do formátu HTML. Můžete také specifikovat velikost obrázku pomocí atributů výšky a šířky, které ukazují v pixelech nebo v procentech. Upozorňujeme, že obrázek bude zobrazen kvůli změně velikosti při spuštění. Prohlížeč bude nejprve zpočátku používat skutečnou velikost obrázku. Z tohoto důvodu je váš obrázek příliš velký, je lepší jej změnit. velikost s pomocí programy pro úpravy fotografií a nikoliv pouze adresa odkazu. Nyní může váš kód vypadat takto:

<img src = "URL obrázku" alt = "textový popisek" title = "Tooltip" height = "50%" width = "50%

<img src = "URL obrázku" alt = "textový popisek" title = "Tooltip" height = "25px" width = "50px"

Další atributy

Hodnota těchto atributů je buď kladná hodnota pixelu nebo procento s původním (1-100%). Když mluvíme o tom, jak vložit obrázek do HTML, můžete si také vzít na vědomí, že jej lze umístit kdekoli na webové stránce s atributem zarovnání - horní, dolní, střední, pravý, levý atd. Atribut HSPACE slouží k vkládání snímků vodorovně na levé a pravé straně, VSPACE - pro vertikální načtení mezi horní a dolní částí stránky a relativně k jinému obsahu. Pokud mluvíme obecně o HTML - jak vložit obrázek a jak přidávat obsah na stránku, hlavní věcí není přehánět. V opačném případě bude váš zdroj vypadat nedbalý a příliš "barevný". GIF bude nejlepší řešení pro zobrazování log nebo animací a JPEG je vhodnější pro kvalitní obrázky a fotografie.