I'm looking for the best techinique to draw lines accurately over monospaced text in a web page I am serving.
The effect I was is like this:

http://oi43.tinypic.com/ea5x1w.jpg

The text should actually be text, so it is selectable, rather than just an image with text drawn in it.

What is a good approach here? I'm aware of many javascript frameworks, e.g. http://artisanjs.com/, but nothing jumps out at me. I think the main issue is finding the exact proportions of the text so I know where to draw lines.

Thanks.