Cascading Style Sheets/Defining Style Rules
You associate formatting instructions with a web page by defining CSS rules (whether in separate files, embedded, or inline see Applying CSS to HTML and XHTML)
Syntax
[edit | edit source]Each rule has two parts: a selector and a group of one or more declarations surrounded by braces (curly brackets):
- selector { declaration; declaration2; ...}
Each declaration is formed like this:
- property: value
Remember that there can be several declarations in one rule. A common mistake is to mix up colons, which separate the property and value of a declaration, and semicolons, which separate declarations. A selector chooses the elements for which the rule applies and the declaration sets the value for the different properties of the elements that are chosen.
The property is one of many properties. w3.org has a list of all of the CSS Properties.
Basic Uses
[edit | edit source]Here is an example of how you would make all span
elements appear bold:
span {
font-weight: bold;
}
The font-weight: bold;
declaration has the property font-weight
and the value bold
which makes the font bold.
That would appear like this:
A slightly more complex example is
span {
font-weight: bold;
color: yellow;
background-color: black;
}
That would appear like this:
You can use many other properties, and values, but this is just a beginning as to how to use CSS.