Article Class: Does Load Order Matter?
Solution 1:
What you're asking about is the order of precedence of applying CSS rules. Simplified:
It does not matter in which order you specify the classes on an element (
class="foo bar baz"
).It does matter in which order you write the CSS declarations in your CSS file.
foo { ... } bar { ... } baz { ... }
Later rules override earlier rules.
You are applying properties specified in these CSS rules to an element. An element can only have one such property, they do not "stack". If two CSS rules specify the same property, later rules overwrite that property on the element.
Example:
<div class="baz bar foo">
.foo {
color: blue;
border: 1px solid green;
}
.bar {
color: black;
border-color: orange;
}
.baz {
color: red;
margin: 10em;
}
Again, the order of the classes in the class="..."
attribute is irrelevant. All three classes are applied to the element. First, .foo
, then .bar
, then .baz
. The element will have the following properties, which are the result of merging the above rules:
color: red; # from.bazborder-color: orange; # from.barborder-style: solid; # from.fooborder-width: 1px; # from.foomargin: 10em; # from.baz
(Note that rule precedence is actually a little more complex than that and actually depends on the specificity of the selector, but the above goes for equally specific selectors.)
Post a Comment for "Article Class: Does Load Order Matter?"