Images

Element img

The <img> element allow to add image to html document. Closing tag can be omitted.
If width and height are not specified, the page might flicker while the image loads.
You can use image as link, by putting img element inside the a element.

<img src="/images/java_icon512x512.png" alt="Java icon" style="width:128px; height:128px;">
<img src="/images/java_icon512x512.png" alt="Java icon" width="128" height="128">
<a href="/images/java_icon512x512.png" target="_blank">
    <img src="/images/java_icon512x512.png" alt="Java icon" style="width:32px; height:128px;">
</a>

Element map

The <map> element defines a clickable areas on image.

Element has two main attributes: shape and coords The shape attribute defines a shape of clickable area and can be one of followed values:

• rect defines a rectangular region
• circle defines a circular region
• poly defines a polygonal region
• default defines the entire region

 <img src="/images/example1_512.jpg" width="128" 
height="128" alt="example image" usemap="#mymap">

<map name="mymap">
  <area shape="rect" coords="290,172,333,250" alt="car" href="/images/car.png">
  <area shape="circle" coords="189,22,55" alt="cyclist" href="/images/cyclist.png">
  <area shape="default"  alt="full image" href="/images/example1_512.jpg">
</map>