According this site externalcss3 The CSS Rule object of the styleSheet object lets you access the individual rules of a stylesheet.
So If I try to run this piece of code(*) on stackoverflow page, using the javascript console, I expect to see some CSS Rules written in this page http://cdn.sstatic.net/stackoverflow/all.css?v=04e0337352b3.
(*)
var mysheet=document.styleSheets[0]
var myrules=mysheet.cssRules? mysheet.cssRules: mysheet.rules
for (i=0; i<myrules.length; i++) {
console.log(myrules[i].selectorText.toLowerCase());
}
Actually the result of console.log is something different from what I would expect:
object[type="application/x-shockwave-flash"], object[type="application/futuresplash"], object[data*=".swf"], object[src*=".swf"], embed[type="application/x-shockwave-flash"], embed[type="application/futuresplash"], embed[src*=".swf"]
What have I Missed? Sorry for my ignorance and your time.
A CSS rule is a grouping of one or more CSS properties which are to be applied to one or more target HTML elements. A CSS rule consists of a CSS selector and a set of CSS properties. The CSS selector determines what HTML elements to target with the CSS rule.
Inheritance, the Cascade, and Specificity are the big three. Understanding these concepts will allow you to write very powerful stylesheets and also save time by writing fewer CSS rules.
A Cascading Style Sheet (CSS) rule is a statement that defines the style of one or more elements in your web page. These rules follow a specific structure. The format or syntax for CSS rules consists of a selector and a declaration. A declaration block consists of several declarations for s given selector.
It seems you can only access the rules in the CSS file if they are from the same domain.
Read this thread: Reading the rules of a cross domain CSS file in DOM
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With