Difference between revisions of "CSS GUIDE -MOZ-BORDER-TOP-COLORS"
| (9 intermediate revisions by the same user not shown) | |||
| Line 4: | Line 4: | ||
== Syntax == | == Syntax == | ||
| − | -moz-border- | + | -moz-border-top-colors: [<color> | transparent,]* <color> | transparent |
== Legal Values == | == Legal Values == | ||
| Line 15: | Line 15: | ||
== Mozilla Recommended Values == | == Mozilla Recommended Values == | ||
| − | <color> - specifies the color of a line of pixels in the | + | <color> - specifies the color of a line of pixels in the top border |
| + | |||
transparent - the line of pixels does not have its own color, instead showing the color of the element behind it | transparent - the line of pixels does not have its own color, instead showing the color of the element behind it | ||
== Usage Examples == | == Usage Examples == | ||
| + | <html> | ||
| + | <head> | ||
| + | <style type="text/css"> | ||
| + | a.example { | ||
| + | border: 5px solid #000000; | ||
| + | /* The color of the top border will be red, green, blue, white, then white, starting at the outside */ | ||
| + | -moz-border-top-colors: #FF0000 #00FF00 #0000FF #FFFFFF; | ||
| + | } | ||
| + | </style> | ||
| + | <head> | ||
| + | <body> | ||
| + | <a class="example">Hello World </a> | ||
| + | </body> | ||
| + | </html> | ||
== Notes == | == Notes == | ||
| Line 24: | Line 39: | ||
== Browser Compatibility == | == Browser Compatibility == | ||
| + | Netscape 6.+ | ||
| + | |||
| + | Mozilla 0.9.8+ | ||
| + | |||
| + | Firefox 1.5+ | ||
== See Also == | == See Also == | ||
| + | |||
| + | [http://zenit.senecac.on.ca/wiki/index.php?title=CSS_GUIDE_-MOZ-BORDER-BOTTOM-COLORS -moz-border-bottom-colors] | ||
| + | |||
| + | [http://zenit.senecac.on.ca/wiki/index.php?title=CSS_GUIDE_-MOZ-BORDER-LEFT-COLORS -moz-border-left-colors] | ||
| + | |||
| + | [http://zenit.senecac.on.ca/wiki/index.php?title=CSS_GUIDE_-MOZ-BORDER-RIGHT-COLOR -moz-border-right-colors] | ||
| + | |||
| + | == References == | ||
| + | |||
| + | [http://developer.mozilla.org/en/docs/CSS:-moz-border-bottom-colors Mozilla Developer's CSS] | ||
| + | |||
| + | [http://developer.mozilla.org/en/docs/Mozilla_CSS_Extensions#-moz-border-bottom-colors Mozilla Developer's CSS Extension] | ||
| + | |||
| + | [http://www.eightlines.com/neil/mozskin/csscommands.html Mozilla Specific CSS] | ||
| + | |||
| + | [http://www.blooberry.com/indexdot/css/properties/extensions/nsextensions.htm Netscape CSS] | ||
Latest revision as of 02:38, 14 December 2006
Contents
Summary
-moz-border-top-colors is a Mozilla property extension to CSS to use a color striping effect on the top border. Each colour is one pixel in the border. If you want the border to be 3 pixels wide you define each colour separated by a space.
Syntax
-moz-border-top-colors: [<color> | transparent,]* <color> | transparent
Legal Values
| Value | Description |
|---|---|
| inherit | Use the value of this property from the parent element. |
| None | [DEFAULT] Do not use any color striping for this border side. |
| Colour+ | Indicating one or more Colour values |
Mozilla Recommended Values
<color> - specifies the color of a line of pixels in the top border
transparent - the line of pixels does not have its own color, instead showing the color of the element behind it
Usage Examples
<html>
<head>
<style type="text/css">
a.example {
border: 5px solid #000000;
/* The color of the top border will be red, green, blue, white, then white, starting at the outside */
-moz-border-top-colors: #FF0000 #00FF00 #0000FF #FFFFFF;
}
</style>
<head>
<body>
<a class="example">Hello World </a>
</body>
</html>
Notes
Specification Conformance
Browser Compatibility
Netscape 6.+
Mozilla 0.9.8+
Firefox 1.5+
