HTML pozwala nam używać obrazów na stronach internetowych i uczynić je bardziej atrakcyjnymi, stosując różne style. Jeśli chcesz zmienić proporcje obrazu lub obraz nie pasuje do układu strony internetowej, możesz go zmienić rozmiar. W tym celu możesz skorzystać z „szerokość" I "wysokość„Właściwości na„img”Tag. Te wartości właściwości można łatwo ustawić w pikselach CSS.

W niniejszej instrukcji poznasz metodę rozmiaru obrazu w HTML.

Przed rozpoczęciem konieczne jest dodanie obrazu do pliku HTML, na którym zostanie wykonana operacja rozmiaru obrazu.

Jak osadzić obraz w HTML?

Aby dodać obraz w HTML, użyj następującej składni:

Opis wyżej wymienionej składni opisano poniżej. „„img„Tag używa dwóch atrybutów:

• • „SRC” służy do zapewnienia ścieżki (URL) obrazu.
  • „Alt” służy do dostarczenia alternatywnego tekstu, jeśli obraz nie jest wyświetlany.

Html

Poniższy kod reprezentuje dwa Divy. W pierwszym DIV dodaliśmy nagłówek w górnym środku naszej strony jako „Rozmiar obrazu w HTML”Za pomocą

etykietka:

Rozmiar obrazu w HTML

Drugi Div jest dodawany do klasy nazwanej „pojemnik”I do reprezentowania obrazu w centrum, użyliśmy znacznika. W środku napisz poniżej wspomnianego kodu, aby dodać obraz:

Wybrany obraz z „640*437„Współczynnik kształtu będzie wyglądał tak:

Następna sekcja pokaże metodę zmiany rozmiaru obrazu.

Jak zmienić rozmiar obrazu w HTML?

Możesz dostosować rozmiar obrazu lub zmienić go rozmiar, używając „szerokość" I "wysokość”Atrybuty ustawiania szerokości i wysokości.

Teraz ustaw wartość szerokości dodanego obrazu jako „300”I zobacz, jak to działa:

Można zauważyć, że szerokość obrazu została zmieniona i została pomyślnie zmieniona:

Oprócz szerokości „wysokość„Atrybut można również wykorzystać w tym samym celu. Aby wyświetlić różnicę wielkości, ustaw „550„Piksele jako wysokość obrazu:

Możesz wyraźnie obserwować różnicę w rozmiarze obrazu:

W ten sposób do rozmiaru obrazu używane są atrybuty szerokości i wysokości.

Wniosek

W HTML „The”wysokość" I "szerokość„Atrybuty są wykorzystywane do zmiany rozmiaru obrazu. Możesz zmienić domyślny współczynnik kształtu dodanego obrazu, ustawiając wartości tych atrybutów. W rezultacie można zobaczyć wyraźną różnicę w odniesieniu do wielkości obrazu. Ten blog wykazał metodę stosowania właściwości wysokości i wagi do zmiany rozmiaru obrazów w HTML.