HTML and CSS Reference
In-Depth Information
li {
/** style your alternating li here **/
a {
/** style your li link here **/
}
}
}
}
/** and the story continues **/
This code is much easier to maintain. Should you change the classname for your
block, it's a simple case of changing the classname once within the nested
style. If you need to add more elements, you just need to add another class or
element that you would like to style in the appropriate place. For instance, if you
wanted to style a link within the heading, you can do the following using the
preferred SCSS format.
.block {
/** style your block here **/
h1.heading {
/** style your header here **/
a {
/** style your heading link here **/
}
}
ul.alternating {
/** style your block ul here **/
li {
/** style your alternating li here **/
a {
/** style your li link here **/
}
}
}
}
Compiling
The preceding code will need to be compiled into CSS for it to be
understandable by the web browser. You do not link SASS files directly into
your HTML document; instead, you link the generated CSS file. You can compile
SASS files directly from Aptana Studio using the built-in tools.
