| | | background |
This selector allows the setting of all of the background properties (for this block) at one time. Each of the properties below can be set with this selector. The method is to state the legal value of the property to be set separated by spaces. I have set the background for this table cell only, with these arguments: style="background: 'url(blue.jpg)' 'repeat-y' '#ff0000' 'scroll'".I have included each value in single quotes. Without them, Netscape crashes. |
| | | |
background-attachment |
background-image: 'url(ldbike1.gif)'; background-attachment: 'scroll'"
Possible Values
scroll|fixed |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
There are two possible conditions in which a background is used. It either moves with the text as the text is scrolled or it remains stationary with the text scrolling past it. Microsoft IE uses a tag called <bgproperties> to accomplish the same sort of thing with the page background.
"If a background image is specified, the value of "background-attachyment' determines if it is fixed with regard to the canvas or if it scrolls along with the content." (w3)
Browsers may treat 'fixed' as 'scroll'. However, it is recommended they interpret 'fixed' correctly, at least on the HTML and BODY elements, since there is no way for an author to provide an image only for the browsers that support 'fixed'.
|
| | | | background-color |
Possible Values
<color>|transparent |
Initial Value
transparent |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
style="background-color: '#b0e0e6'" |
This sets the background color for the defined block. The colours can be represented by the colour names or hex values. colours
|
| | | | background-image |
Possible Values
url(name.gif)|none |
Initial Value
none |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
style="background-image: 'url(image.gif)'" |
"This property sets the background image of an element. When setting a background image, one should also set a background color that will be used when the image is unavailable. When the image is available, it is overlaid on top of the background color." (w3)
The image specified here uses no further arguments other than the name of the background image.
<td style="background-image: 'url(ldbike1.gif)'">
|
| | | | background-position |
Possible Values
[<percentage>|<length>] {1,2} [top|center|\bottom]||[left|center|right] |
Initial Value
0% 0% |
Applies to
block level and replaced elements |
Inherited
NO |
Percentage Values allowed?
refer to the size of the element itself |
Example of use
style="background-position: 'center center'" |
"If a background image has been specified, the value of 'background-position' specifies its initial position.
With a value pair of '0% 0%', the upper left corner of the image is placed in the upper left corner of the box that surrounds the content of the element (i.e., not the box that surrounds the padding, border or margin). A value pair of '100% 100%' places the lower right corner of the image in the lower right corner of the element. With a value pair of '14% 84%', the point 14% across and 84% down, the image is to be placed at the point 14% across and 84% down the element.
With a value pair of '2cm 2cm', the upper left corner of the image is placed 2cm to the right and 2cm below the upper left corner of the element.
If only one percentage or length value is given, it sets the horizontal position only, the vertical position will be 50%. If two values are given, the horizontal position comes first. Combinations of length and percentage values are allowed, e.g. '50% 2cm'. Negative positions are allowed.
One can also use keyword values to indicate the position of the background image. Keyboards cannot be combined with percentage values, or length values. The possible combinations of keywords and their interpretations are as follows:
| Possible keywords | Percentage equivalent |
|---|
| 'top left' or 'left top' | 0% 0% |
| 'top', 'top center' or 'center top' | 50% 0% |
| 'right top' or 'top right' | 100% 0% |
| 'left', 'left center' or 'center left' | 0% 50% |
| 'center' or 'center center' | 50% 50% |
| 'right', 'right center' or 'center right' | 100% 50% |
| 'bottom left' or 'left bottom' | 0% 100% |
| 'bottom', 'bottom center' or 'center bottom' | 50% 100% |
| 'bottom right' or 'right bottom' | 100% 100% |
"(w3)
|
| | | | background-repeat |
Possible Values
repeat | repeat-x | repeat-y | no-repeat |
Initial Value
repeat |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
style="background-repeat: 'repeat-x'" |
This selector allows the background to be repeated horizontally (repeat-x), vertically (repeat-y), not at all (no-repeat) or totally (repeat). The 'repeat' value renders the background in the same way that background is repeated in the <body> tag.
|
| | | border | 
The figure above shows the location of the border device. "Border" is defined and controlled by the properties and values below.
Possible Values
<border-width>, <border-style>, <color> |
Initial Value
medium |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | | border-top-width |
Possible Values
thin|medium|thick|<length> |
Initial Value
medium |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
This sets the width of the top border.
|
| | | | border-right-width |
Possible Values
thin|medium|thick|<length> |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | | border-bottom-width |
Possible Values
thin|medium|thick|<length> |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | | border-left-width |
Possible Values
thin|medium|thick|<length> |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | | border-width |
Possible Values
thin|medium|thick|<length> |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | | border-color |
Possible Values
<color> |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | | border-style |
Possible Values
none|dotted|dashed|solid|double|groove|ridge|inset|outset |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | | border-top |
Possible Values
<border-top-width>, <border-style>, <color> |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | | border-right |
Possible Values
<border-right-width>, <border-style>, <color> |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | | border-bottom |
Possible Values
<border-bottom-width>, <border-style>, <color> |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | | border-left |
Possible Values
<border-left-width>, <border-style>, <color> |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | clear |
Possible Values
none|left|right|both |
Initial Value
none |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | color |
Possible Values
<color> |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
The specification states that there are two different ways to specify a color: 'red' (they term as "natural language"), rgb(255,0,0) (they term this as "rgb range 0-255"). There is a possible third method: #fc00fc. As at July 4, 1997, it worked with MSIE 4.0.
|
| | | display |
Possible Values
block|inline|list-item|none |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | float |
Possible Values
left|right|none |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | font | |
| | | | font-family |
Possible Values
<family-name>|<generic-family> |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
This is a test of font-family.
|
| | | | font-size |
Possible Values
scroll|fixed |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | | font-style |
Possible Values
scroll|fixed |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | | font-variant |
Possible Values
scroll|fixed |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | | font-weight |
Possible Values
scroll|fixed |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | height |
Possible Values
scroll|fixed |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | letter-spacing |
Possible Values
scroll|fixed |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | line-height |
Possible Values
scroll|fixed |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | list-style | |
| | | | list-style-type |
Possible Values
scroll|fixed |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | | list-style-image |
Possible Values
scroll|fixed |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | | list-style-position |
Possible Values
scroll|fixed |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | | list-style |
Possible Values
scroll|fixed |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | margin | |
| | | | margin-top |
Possible Values
scroll|fixed |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | | margin-right |
Possible Values
scroll|fixed |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | | margin-bottom |
Possible Values
scroll|fixed |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | | margin-left |
Possible Values
scroll|fixed |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | padding | |
| | | | padding-top |
Possible Values
scroll|fixed |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | | padding-right |
Possible Values
scroll|fixed |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | | padding-bottom |
Possible Values
scroll|fixed |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | | padding-left |
Possible Values
scroll|fixed |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | text-align |
Possible Values
scroll|fixed |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | text-decoration |
Possible Values
scroll|fixed |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | text-indent |
Possible Values
scroll|fixed |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | text-transform |
Possible Values
scroll|fixed |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | vertical-align |
Possible Values
scroll|fixed |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | white-space |
Possible Values
scroll|fixed |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | width |
Possible Values
scroll|fixed |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|
| | | word-spacing |
Possible Values
scroll|fixed |
Initial Value
scroll |
Applies to
all elements |
Inherited
NO |
Percentage Values allowed?
N/A |
Example of use
***** |
|