There are two difficulties when dealing with isometric tiles. First, it's very simple to display an orthogonal grid with DOM elements, whereas it's more complicated to display an isometric one. Secondly, the occlusion is harder to compute.
We will use a trick here to generate our tile map. Each of our tiles will be stored in an area where they are surrounded by transparent pixels in such a way as to give them a square shape, just like the following screenshot:
To make the magic happen, we will use two normal tile maps to display one isometric one. They will overlap, but with an offset between them equal to half the height and half the width of one tile. The following figure shows you how it would look:
