CSS Functions | CSS: Presentation Layer

Standards Based Development

css functions:

attr()

calc()

counter()

element() Function

The element() function in css defines an image css data type value generated from an arbitrary html element. The img / is live, so if the element is changed, the css properties using the resulting value are automatically updated.

-moz-element

This box uses the element with the #myBackground1 ID as its background!

This text is part of the background. Cool, huh?

Example Code


<div style="width:400px; height:400px; background:-moz-element(#myBackground1) no-repeat;">
  <p>This box uses the element with the #myBackground1 ID as its background!</p>
</div>
 
<div style="overflow:hidden; height:0;">
  <div id="myBackground1" style="width:1024px; height:1024px; background-image: -moz-linear-gradient(left, red, orange, yellow, white);">
  <p style="-moz-transform-origin:0 0; -moz-transform: rotate(45deg); color:white;">This text is part of the background. Cool, huh?</p>
  </div>
</div>

linear-gradient()

max()

min()

radial-gradient()

repeating-linear-gradient()

repeating-radial-gradient()

url()

References and Resources