The syntax of CSS declaration is as follows:
selector {
property:value;
...
}
There is no limit on the number of property:value pair that can be specified for a selector.
There are three main types of selectors: type selectors, class selectors, and ID selectors.
Type selectors are existing (X)HTML tags such as <body> and <h1>. Class and ID selectors are user-defined selectors. We will discuss these two types of selectors in more detail in a later section.
Styles are typically specified in a property:value pair. For example, if we want to specify that a certain element is to have a yellow color, we use the following property:value declaration:
In the above declaration, "color" is a property, and "yellow" is a value.
Please note that in some instances there may be multiple values for a given property. Those are generally shortcut situations -- for example, the margin property can take up to 4 values, each specifying the margin width of one side.
Grouping
If multiple selectors share the same CSS properties, they can be declared together. This is called "grouping". For example, if <h1>, <h2>, and <h3> share they same style, they can be declared together as follows:
|
h1 h2 h3 {
property:value;
...
}
|
Descendant Selectors
We can specify the style of an element only when it is inside another element. To accomplish this, we use the concept of descendant selectors.
The syntax for declaring a descendant selector is:
[Parent Selector] [Child Selector] {
property:value;
...
}
The style defined above will apply to child selectors only when they are inside the parent selector. Such declarations can go on for more than two levels.
For example, in the declaration below,
means that text in the <b> element inside the <li> element will be yellow. Text in the <b> elements not within the <li> element will not be affected by this stylesheet.
Next: Apply CSS
Link to this page: If you find this page useful, we encourage you to link to this page. Simply copy and paste the code below to your website, blog, or profile.
More Tutorials: SQL PHP HTML
Copyright 2007-2009 1keydata.com All Rights Reserved. Privacy Policy
|