Képek HTML kézi web

Ha csak szöveget szúrunk be weboldalunkra, akkor azok nagyon egyszerűek és nem túl világosak. Éppen ezért a HTML-ben képesek vagyunk képeket beilleszteni.

A képek a weboldal reprezentatív elemei vagy díszítő elemek lehetnek. Bár dekoratív elemekként CSS-t kell használnunk, hogy beillesszük őket weboldalunkba.

A weboldalon belüli képek használatát körültekintően kell elvégezni, mivel a weboldalunkon elhelyezett minden kép megnöveli az oldal méretét (súlyát). Ezért ez befolyásolja az oldal letöltési idejét.

Kép beszúrása: Az img elem

Kép HTML-beillesztéséhez megvan az img elem, amelynek alapvető szintaxisa:

Mint láthatjuk, az img elem egyszerű elem, tehát nincs bezáró eleme, és a visszavágással végződik.

Az img elem fő attribútuma az src a kép elérési útját jelöli. Így, ha a kép ugyanazon az úton van, mint a weboldalunk, akkor a következőket tesszük:

A kép akár egy másik szerveren is elhelyezkedhet. Ebben az esetben a képet tartalmazó URL-nek meg kell jelölnie a képet tároló protokollt és szervert. Például a következő kóddal rendelkezhetünk:

---