HTML and CSS Reference
In-Depth Information
text-rendering
This SVG inherited property provides information to the browser about how text should be
rendered. Generally, it is used to specify a trade-off between performance and quality.
Syntax
text-rendering: auto | optimizeSpeed | optimizeLegibility |
geometricPrecision | inherit
The default value is
auto
. A value of
optimizeSpeed
tells the browser to focus on
rendering speed, a value of
optimizeLegibility
tells the browser to focus on text details
like kerning and ligatures to improve readability, and a value of
geometricPrecision
tells
the browser to focus on the geometric layout of text as opposed to speed or readability.
Examples
* {text-rendering: optimizeSpeed;}
.script {text-rendering: optimizeLegibility;}
Compatibility
No CSS specification (from SVG)
Firefox 3+
Notes
• This is really an SVG property that may have applications within an HTML document.
• If used in a CSS setting, it would seem more appropriately written as
-moz-text-
rendering
, but that currently is not the case.
text-shadow
This property defines a shadow effect for text.
Syntax
The shadow is defined by a comma-separated list of shadow effects to be applied to the text
of the element,
text-shadow:
shadow1
[,
shadow2
, ...
shadowN
]
where each
shadow
value is defined as
horizontal-offset vertical-offset [blur-radius] color
The shadow effects are applied in the order specified and may overlay each other, but they
will never overlay the text itself. Each shadow effect must specify a shadow offset horizontally
and vertically and may optionally specify a blur radius and a shadow color.
A shadow offset is specified with two length values, usually in absolute measurement,
that indicate the distance from the text. The horizontal offset value specifies the horizontal
distance to the right of the text. A negative horizontal length value places the shadow to
