Obrázky sú veľmi dôležitou súčasťou webovej stránky, pretože zlepšujú vzhľad webovej stránky a zvyšujú mieru interakcie so zákazníkom. USP viacerých webových stránok je spôsob, akým organizujú rôzne obrázky na svojich webových stránkach a pridávajú k nim príchute. V tomto V článku o obrázkoch pochopíme, ako vložiť obrázky na webovú stránku pomocou kódu HTML v nasledujúcom poradí:
Ako pridať obrázok v HTML
Vložiť obrázok na webovú stránku vám dáva HTML značka. Ďalším dôležitým bodom na zapamätanie je,
nemá zatváraciu značku. scr Atribút sa používa na určenie cesty k obrázku, čo môže byť adresa URL alebo cesta k obrázku zo systému / servera. Najprv začnime so základnou syntaxou vkladania obrázkov na webové stránky pomocou kódu HTML.
Syntax
img src = 'img / front-end-web-vývoj / 50 / what-are-html-images.png'>Vzorový kód
Vkladanie obrázkov vo formáte HTML na webovú stránku
Podobne ako v prípade iných značiek, aj tu sú spojené rôzne atribúty značka. Pozrime sa na každého z nich jeden po druhom, pochopíme jeho potrebu a ako ich používať.
Značky obrázkov HTML
- alt Atribút
Atribút alt je alternatívny text pre obrázok. Dôvod, prečo bol zavedený atribút alt, je ten, že z akýchkoľvek dôvodov sa obrázok nemohol načítať, potom by sa mal objaviť alternatívny text poskytujúci predstavu o obrázku. Dôvodom na načítanie obrázka môže byť pomalé pripojenie k internetu alebo sa obrázok nenachádza v poskytnutom zdroji atď.
Ak sa obrázok nachádza v rovnakom priečinku, v ktorom je súbor HTML, môžete priamo určiť názov súboru. V opačnom prípade máte k dispozícii absolútnu cestu k obrazovému súboru.
Hodnota atribútu alt by mala popisovať obrázok.
Príklad
Vkladanie obrázkov vo formáte HTML na webovú stránku
apache spark vs hadoop mapreduce
- Šírka a výška obrázka
Atribút Style sa používa na nastavenie výšky a šírky obrázka. V atribúte štýl zadáte štýl CSS.
Vkladanie obrázkov vo formáte HTML na webovú stránku
Pri vkladaní obrázka na webovú stránku pomocou kódu HTML sú niektoré z dôležitých bodov:
- Atribúty šírky a výšky sú definované v pixeloch.
- Môžete tiež definovať šírku a výšku obrázka v percentách. Zváži percento podľa celej webovej stránky.
- Ak zadáte iba jeden z nich, upraví sa podľa toho aj druhý.
- Vkladanie obrázkov pomocou adresy URL
HTML vám tiež dáva flexibilitu, keď môžete vybrať obrázok z iného servera iba zadaním adresy URL. Na hosťovanie obrázkov môžete použiť samostatný server a potom ich vložiť pomocou adresy URL.
Vkladanie obrázkov vo formáte HTML na webovú stránku
- Obrázok ako odkaz
Obrázok môžete tiež použiť ako odkaz, kde môže používateľ kliknúť na obrázok a pristúpiť na novú webovú stránku. Ak to chcete urobiť, stačí vložiť deň v značka.
Vkladanie obrázkov vo formáte HTML na webovú stránku
- Obrázok plávajúci
Zarovnanie obrázka môžete upraviť aj pomocou vlastnosti float CSS. V atribúte style musí byť uvedená celá vlastnosť CSS.
Obrázok HTML
- Obrázkové mapy
Toto je jedna z dôležitých funkcií poskytovaných HTML. značka pomáha pri definovaní obrazovej mapy. Určite sa pýtate, čo je to obrazová mapa. Obrazová mapa je obraz s klikateľnými oblasťami
Obrázok HTML
- Obrázok na pozadí
Môžete tiež pridať obrázok na pozadie na webovej stránke. Musíte len použiť vlastnosť CSS, tj. Background-image v značke štýlu a pridať ju do prvku HTML.
Obrázok HTMLObrázok na pozadí
Prvok BODY
Týmto sa dostávame na koniec tohto blogu obrázkov HTML.Teraz po vykonaní vyššie uvedených úryvkov by ste pochopili, ako vložiť obrázok do HTML. Dúfam, že tento blog bude informatívny a bude pre vás pridanou hodnotou.
Vyskúšajte naše ktorá prináša živé školenie vedené inštruktorom a skúsenosti s projektmi v reálnom živote. Toto školenie umožňuje získať zručnosti na prácu s webovými technológiami typu back-end a front-end. Zahŕňa školenie zamerané na vývoj webových aplikácií, jQuery, Angular, NodeJS, ExpressJS a MongoDB.
Máte na nás otázku? Uveďte to v sekcii komentárov v blogu „HTML Images“ a my sa vám ozveme.
ako teraz používať službu