Jak dodać obraz w HTML

Jeśli chcesz zwrócić uwagę użytkowników, gdy odwiedzi twoją stronę internetową, dodanie obrazów może być fajną rzeczą do zrobienia. Obrazy pojawiają się w Twojej witrynie bardziej atrakcyjnie, co stanowi ogólne piękno Twojej witryny. Ale jak dodać obrazy do strony internetowej? Cóż, podsumowaliśmy sposoby, używając, które obrazy można wstawić na strony internetowe.

Jak dodać obrazy w HTML

Aby dodać obrazy do stron internetowych, użyj etykietka. Ten znacznik jest pusty i składa się z pewnych atrybutów i nie ma znacznika końcowego.

Atrybuty znacznika są; src atrybut używany do zdefiniowania ścieżki obrazu i Alt Atrybut jest używany jako alternatywny tekst w scenariuszach, gdy obraz nie ładuje się z powodu pewnego problemu.

Tutaj pokazaliśmy, jak używać tego znacznika do dodawania obrazów.

Html

W powyższym kodzie dodajemy trzy obrazy do strony internetowej za pomocą znacznika. W każdym znaczniku ścieżka obrazów została dostarczona do atrybutu SRC i do tych znaczników dodano alternatywny tekst. Ponadto dostarczamy również szerokość i wysokość obrazów.

Wyjście

Obrazy zostały dodane do strony.

Jak dostosować szerokość i wysokość obrazu

Jeśli chcesz zmienić szerokość i wysokość obrazu, po prostu użyj właściwości szerokości i wysokości w znaczniku.

Html

Powyższy kod doda obrazy do strony internetowej o szerokości i wysokości określonej przy użyciu właściwości szerokości i wysokości.

Wyjście

Oba obrazy mają różne szerokości i wysokości.

Jak dodać obrazy z innego folderu

Jeśli obrazy, które chcesz osadzić na stronie internetowej, są obecne w innym folderze, jak pokazano na zrzucie ekranu poniżej, dodaj nazwę folderu w atrybucie SRC.

Obrazy są obecne w folderze o nazwie „obrazy”.

Html

Aby poprawnie zademonstrować, jak dodać obrazy z innego folderu, załączyliśmy zrzut ekranu edytora kodu. Sekcja podświetlona na czerwono pokazuje, że obrazy są obecne w innym folderze, który jest obecny tuż obok pliku HTML. Nazwa folderu wraz z nazwą i formatem obrazu jest dostarczana do atrybutu SRC znacznika, jak wyróżniono na zielono.

Wyjście

Obraz został dodany z innego folderu.

Jak dodawać obrazy z innej strony internetowej

Aby dodać obrazy z innej strony internetowej lub źródła, musisz podać pełny adres URL tego źródła do atrybutu SRC tagu.

Html

Powyższy kod pobiera obraz z określonego adresu URL i doda go do naszej strony internetowej.

Wyjście

Obraz został pomyślnie dodany z innej strony internetowej.

Jak dodawać obrazy jako linki

Jeśli chcesz przekierować użytkownika na inną stronę internetową, możesz użyć obrazów do wykonania tego zadania.

Html

W powyższym kodzie, przede wszystkim podajemy link strony internetowej, do której chcemy przekierować naszych użytkowników i podawać ten link do atrybutu tagu HREF, a następnie gniazdowanie naszego wizerunku, który jest GIF w tym przypadku w tym przypadku w zakotwiorze etykietka.

Wyjście

Gdy użytkownik kliknie obraz, zostanie przekierowany na stronę internetową podaną jako link w znaczniku kotwicy.

Wniosek

W celu dodania obrazów w HTML Użyj etykietka. Ten znacznik jest pusty, nie ma znacznika końcowego i składa się z dwóch wymaganych atrybutów; atrybut SRC i atrybut alt. Atrybut SRC służy do podania ścieżki obrazu, podczas gdy atrybut Alt podaje tekst wyświetlany jako alternatywny w przypadku, gdy obraz nie ładuje się z powodu pewnego problemu. Za pomocą tego znacznika możesz dodawać obrazy z innego folderu lub innej witryny lub używać ich jako linków.