How to prevent "hotlinking" of your images on a web site

From the tutorial:

“Hotlinking” is a form of bandwidth theft. Basically, when creating a web page it is easy to link to a file (such as an image or a video) that exists on a remote (completely separate) site. Each time the web page is accessed, the file is retrieved from the remote web site.

Consider this example: You have created a personal gallery of cherished images. Someone else likes one of your images, so they post a “hotlink” to that image on a popular forum that they visit. Now that image is plucked from your web server every single time that page of the forum is viewed. It can quickly add up to thousands of requests, eating into your precious bandwidth allocation. To make matters worse, the image is so popular that it begins to appear in several other forums.