tool to show me just the markup outline in a web page

IS there any tool that does the following, given a url?

1. strip everything (all text) from the page, except the markup (all the html elements)
2. add a border to all the div, span, t开发者_高级运维able, tr, td etc in the page
3. keep the original size of the div, span etc (even though they are empty now, in terms of the data in them)

You could write a browser plugin for that, because it's not hard to do with Javascript:

1. Set the following CSS rule for all elements: color: transparent; which makes the text transparent
2. Add the following CSS rule to all elements you want: outline: 1px solid red;
3. Will automatically happen with the color and outline properties

jQuery example at jsFiddle:

$('*').css( 'color', 'transparent !important' );
$('div, span, table, tr, td, ...').css( 'outline', '1px solid red !important' );