Drawing arrows on an HTML page to visualize semantic links between textual spans

Question

I have an HTML page with some textual spans marked up something like this:

...
p50
...


        

Answer 1

You could get the curved arrow ends using a handful of position:absolute divs with background-image set to transparent GIFs... a set for beginning (top and bottom)... a bacground:repeat div for expandible middle, and another pair for the ends (top and bottom).