Hi Is there a way to check what CSS properties are applied to an HTML Element. I dont want any browser plugin. Using javascript, I want to get a list of all CSS properties set on an html element. If thats not possible, I can always write 100 lines of code and checking the value like if($("div").css("background-color").length > 0){}, for each and every css property.
A:
You might need to be a bit more elaborate. But for now Firebug seems to fit your description.
Russell Dias
2010-10-10 14:05:43
+1
A:
Hi,
Depending on your browser, you can use the following plugins or tools (linked where necessary):
- Firefox - Firebug (download the addon, restart and press F12 to open)
- Google Chrome, Safari - Webkit Inspector (CTRL+SHIFT+I to bring it up)
- Opera - Dragonfly (CTRL+SHIFT+I)
- Internet Explorer 5.5-7 - IE Developer Toolbar (press the icon near your address bar)
- Internet Explorer 8+ - IE Developer Tools (press F12 to open)
Will Morgan
2010-10-10 14:14:06
Stack Overflow uses [Markdown](http://daringfireball.net/projects/markdown/syntax), not BBCode, to format posts.
BoltClock
2010-10-10 14:17:32
Heh, fixed. Thanks. Would be helpful if there was a prominent link to the syntax on the edit page.
Will Morgan
2010-10-10 14:20:43
There is a colored "How to Format" box at the right side.
BoltClock
2010-10-10 14:21:36
All the adverts/rubbish on the RHS have trained my brain to totally ignore the sidebar. Can't believe I missed it!
Will Morgan
2010-10-10 14:30:51
+1
A:
As mentioned, I also recommend you using inspecting tools as Firebug, Webkit Inspector and Dragonfly.
But if you need just a quick check on CSS properties, you can create a quick script. There are some DOM methods and properties that becomes handy, like element.currentStyle and element.getComputedStyle().
Check this out http://blog.stchur.com/2006/06/21/css-computed-style/
Cheers.
Dave
2010-10-10 14:34:45