What does <img> HTML Tag do?
The <img> tag is used to insert an image into a document.
Display
inline
Null element
This element must not contain any content, and does not need a closing tag.

Code Example

<img src="/wp-content/uploads/flamingo.jpg">

Using the <img> tag
The <img> element is the most straight-forward way of displaying a static image on a page. You should normally use it whenever an image is actually a part of the content (as opposed to using an image as part of a page’s design).

All <img> tags must have a defined src attribute. This defines the image to be displayed. Typically, the src is a URL, but a data representation of the image can also be used in some cases.

Inline vs. Block
Intuitively, an image seems like a block element. It has a defined width and height, and cannot be broken over multiple lines. It behaves like a block.

Unfortunately, because of historical reasons, the HTML specification (and all browsers, by default) treat the <img> tag as if it is an inline element. Because of the way browsers handle white space, this can cause problems if you are not careful.

<img src="/wp-content/uploads/flamingo.jpg">
This combination of text and image looks bad on most browsers.


There at least two easy ways to fix this. The simplest is to simply make sure there is a line break before and after your images. This is fine if you don’t care much about flowing text around your image.

<!-- Line breaks around the image. --> This is some text that appears above the image.<br> <img src="/wp-content/uploads/flamingo.jpg"><br> Here is some other text below the image