Write Style Rules to Make Them Understandable
By HTML Tutorials
If you are going to write quite a voluminous CSS-file, you should follow some
general recommendations, which can help to avoid mistakes and to make the code
understandable and convenient.
Write all the rules for every selector in the same place
It is allowed for very selector to add every style parameter and its meaning
apart, as it is shown in the example 18.1.
Example 18.1
TD { background: olive; }
TD { color: white; }
TD { border: 1px solid black; }
But, such a note is not very convenient. It is necessary to repeat one and the
same selector for several times and it is quite easy to become confused in
their amount. That’s why, write the arguments for every selector together. In
this case, the list of notes mentioned will get the following view (example 18.2).
Example 18.2
TD {
background: olive;
color: white;
border: 1px solid black;
}
The form of writing – in one or in several lines – depends on the author’s
desire. Let’s admit that every parameter takes a separate line, it is easier
to find the necessary meaning with the help of a glance. Correspondingly, the
CSS-code editing goes more convenient and faster.
Show the priority meaning, indicated in the code below
If in the beginning there is a parameter with one meaning, which sets for the
selector, and later the same parameter, but already with another meaning, then
there will be applied the meaning, which was set lower in the code (example 18.3).
Example 18.3
P { color: green; }
P { color: red; }
In the given example for the selector P, the color of the text first sets as
green and later – red. As the meaning RED is located lower, than finally it
will be applied to the parameter COLOR.
Indeed, it would be better to avoid such a note and delete the repeating
selector parameters. But the same may occur not evidently, for example, in the
case of connection of the different style files, which consist the same selectors.
Begin with the selectors of the top level
Taking into consideration, that a lot of style qualities of the elements are
inherited from their parents, it is better to begin the style sheet with the
selectors, which are the containers for other elements. Particularly, these
are BODY, TABLE, UL, OL and others. If it is necessary to set the typeface of
the script for the whole text of the web-page, then it is necessary to apply
the parameter FONT-FAMILY to the selector BODY, like it is shown in the example 18.4.
The example 18.4
BODY {
font-family: "Times New Roman", Times, serif; /* Script typeface */
font-size: 110%; /* Script size */
}
The inheritance of the qualities allows not repeat for several times one and
the same parameters, if they were set for the selectors of the top level. But,
not all the attributes are inherited and to some of them, like BORDER it is
necessary to treat several times.
| 
About BTH
User Agreement
Privacy
Site Map
Contact
News Feeds
RSS Feed
Follow @Stephen Bucaro
General Web Design
