Images are a big part of the web, so it's not surprising there's an HTML tag devoted to them. The <img> tag is another tag that doesn't have a closing tag, but there are several important attributes.
src="URL of image"
alt="text to display if image can't be found and for vision impaired folks"
width="# of pixels"
height="# of pixels"
or for width and height, use style (preferred):
style="width:128px; height:128px;"
Also as part of style, you use float:left or float:right to have the image float to the left or right of text.
Here's one place where you can definitely see a difference in your code if you're using Trinket vs. running off your own computer or an actual web server. Images are often placed in their own subfolders for organizational purposes, but in Trinket you can't do that (images are always at the "top" level). This will affect the URL you will use for src.
So, in the example below, if you were running off a web server or your computer, you might have the earth.jpg inside a folder called images. If so, the code would be src="images/earth.jpg" instead of just earth.jpg. On Trinket, we just have to have earth.jpg and make sure we have it on the image tab.
You can also use an image as a link to another page/document by placing the image tag inside the hyperlink tag.
<a href="URL of link"><img src="..." alt="..." style="width:...; height:..."></a>
Notice how the image takes the places of the linked text that is normally displayed.