HTML and CSS Reference
In-Depth Information
Example
<p style="text-decoration: underline;
text-underline-position: above;">
This example uses the text-underline-position property to
place the underlining on top of the text. Why not just set
text-decoration to overline instead?
</p>
Compatibility
CSS3 preliminary
IE 5+
Note
• Under IE 8 this property is also known and should be set as
-ms-text-underline-
position
to correctly identify it as an extension in a standards-compliant mode.
• The value of
auto-pos
is also understood and is the same function as
auto
.
• This property has made some appearances in CSS3, but so far its future is far from
certain as an official standard.
transform
This property allows elements to be offset, rotated, scaled, and skewed in a variety of
different ways.
Syntax
transform: list of
transform-functions
| none
where
transform-functions
include the values in Table 6-11.
Examples
#transform1 {-moz-transform: scale(1.2,1.9);
-webkit-transform: scale(1.2,1.9);}
#transform2 {-moz-transform: scaleX(.5);
-webkit-transform: scaleX(.5);}
#transform3 {-moz-transform: scaleY(3.5);
-webkit-transform: scaleY(3.5);}
#transform4 {-moz-transform: skew(120deg,45deg);
-webkit-transform: skew(120deg,45deg);}
#transform5 {-moz-transform: skewX(45deg);
-webkit-transform: skewX(45deg);}
#transform6 {-moz-transform: skewY(45deg);
-webkit-transform: skewY(45deg);}
#transform7 {-moz-transform: rotate(90deg);
-webkit-transform: rotate(90deg);}
#transform8 {-moz-transform: translate(20%,30%);
-webkit-transform: translate(20%,30%);
background-color: yellow;}
