CSS Attributes Index Color and Background Attributes
Sets or retrieves the color under the content of the object.
CSS |
{ background-color: transparent | strColor } |
Script |
object.style.backgroundColor = transparent | strColor |
transparent |
The color of the next parent background will shine through. |
strColor |
Any of the range of values specified in the Color Table. |
The property is read/write with a default value of transparent. This attribute is not inherited.
This property may be set together with the other background properties using the background composite property.
The sample below demonstrates use of embedded and inline style definitions to specify the background-color attribute of different elements on a page.
<style type="text/css">
<!--
body {
background-color: ghostwhite }
ul {
font: 11pt; text-align: left;
background-color: lightsteelblue; padding: 10;
margin-left: 10%;margin-right: 10% }
table {
background-color: beige }
th {
background-color: darkslategray; color: khaki; padding: 10 }
-->
</style>
...
<div class="back" style="background-color: aliceblue">
<h1 style="background-color: dimgray; padding: 5"> ... </h1>
<table>
<tr>
<td rowspan=2 style="background-color: #cc9"> ... </td>
</tr>
</table>
</div>
Show me
The sample below uses inline event handlers to dynamically change an object’s background color in response to mouse events.
<p onmouseover="this.style.backgroundColor='#7be'"
onclick="this.style.backgroundColor='#7bb'"
onmouseout="this.style.backgroundColor='transparent'">
...
</p>
Show me
The following example allows a user to preview various text and background color combinations. This feature requires Microsoft® Internet Explorer® 4.0 or later.
Show me
background, background-attachment, background-image, background-position, background-repeat