Determining default browser styles for various tags

Question

I want to determine the default styles for various tag names. For example, I want to know what would be the default font-size of an h2.

Is there a way to do that in Javascript ?

The context : I am trying to build a live CSS editor that would let users play with the styling of the various elements on their page. For the initial configuration, I want to read what the various elements would look like.

EDIT: Taking h2 as an example, the jQuery("h2").css("foint-size") works great if there are h2 elements on the page. However, this solution breaks when there are no h2's on the page. In that case, want to know what styles would be applied to an h2 had it been on the page

thanks!

Answer 1

You're looking for getComputedStyle / currentStyle, which will get the actual value of a CSS property, however it was set.

Using jQuery, you can simply call $('<h2>hi!</h2>').css('font-size'), which calls these methods.