cssText property

Sets or retrieves the persisted representation of the style rule.

This property is read/write.

Syntax

JavaScript

object.cssText = p

p = object.cssText

 

Property values

Type: String

the text.

Remarks

This property reflects the current state of the rule and not its initial value.

The number of rules that can be applied at one time with cssText is 4095.

For newly created style sheet objects, you must first append the element to the document before you can set cssText.

Examples

This example uses the cssText property to set the background image and text and border color for a div element, and to display the current cssText value.

The example defines default CSS div element settings, then creates two buttons on the page that each run a JavaScript function. Clicking the Blue button sets the background to a blue-aqua gradient image and the text and border color to white. Clicking the Red button sets the background to a red-bisque gradient image and the text and border color to black.

Code example: http://samples.msdn.microsoft.com/workshop/samples/css/cssText/cssText.html


#myDiv {
  width: 150px;
  height: 150px;
  border: thin solid;
  float: left;
  margin-right: 10px;
  text-align: center;
}


<body>
  <div id="myDiv"></div>
  <input type="button" value="Blue" onclick="blueGradient();">
  <input type="button" value="Red" onclick="redGradient();">
</body>

Each button calls a function that uses the cssText property to set the background image and text and border color, and to display the property value. The following snippet shows the JavaScript code for each function:


function blueGradient() {
  myDiv.style.cssText = "background-image: radial-gradient(blue, aqua); color: white;"
  myDiv.innerHTML = "The cssText value is: " + myDiv.style.cssText;
}
function redGradient() {
  myDiv.style.cssText = "background-image: radial-gradient(red, bisque); color: black;";
  myDiv.innerHTML = "The cssText value is: " + myDiv.style.cssText;
}

See also

CSSFontFaceRule
CSSImportRule
CSSMediaRule
CSSNamespaceRule
CSSRule
CSSStyleDeclaration
currentStyle
page
rule
runtimeStyle
style
styleSheet

 

 

Show:
© 2014 Microsoft