CSS Text Decoration Module Level 3
CSS Text Decoration Module Level 3
W3C Candidate Recommendation Draft
5 May 2022
More details about this document
This version:
Latest published version:
Editor's Draft:
Previous Versions:
History:
Implementation Report:
Test Suite:
Feedback:
CSSWG Issues Repository
Inline In Spec
Editors:
Elika J. Etemad / fantasai
Invited Expert
Koji Ishii
Google
Suggest an Edit for this Spec:
GitHub Editor
W3C
MIT
ERCIM
Keio
Beihang
). W3C
liability
trademark
and
permissive document license
rules apply.
Abstract
This module contains the features of CSS relating to text decoration, such as underlines, text shadows, and emphasis marks.
CSS
is a language for describing the rendering of structured documents
(such as HTML and XML)
on screen, on paper, etc.
Status of this document
This section describes the status of this document at the time of its publication.
A list of current W3C publications
and the latest revision of this technical report
can be found in the
W3C technical reports index at https://www.w3.org/TR/.
This document was published
by the
CSS Working Group
as a
Candidate Recommendation Draft
using the
Recommendation
track
Publication as a Candidate Recommendation
does not imply endorsement by
W3C
and its Members.
A Candidate Recommendation Draft
integrates changes from the previous Candidate Recommendation
that the Working Group intends to include in a subsequent Candidate Recommendation Snapshot.
This is a draft document
and may be updated, replaced
or obsoleted by other documents at any time.
It is inappropriate to cite this document as other than work in progress.
Please send feedback
by
filing issues in GitHub
(preferred),
including the spec code “css-text-decor” in the title, like this:
“[css-text-decor]
…summary of comment…
”.
All issues and comments are
archived
Alternately, feedback can be sent to the (
archived
) public mailing list
www-style@w3.org
This document is governed by the
2 November 2021 W3C Process Document
This document was produced by a group operating under the
W3C Patent Policy
W3C maintains a
public list of any patent disclosures
made in connection with the deliverables of the group;
that page also includes instructions for disclosing a patent.
An individual who has actual knowledge of a patent which the individual believes
contains
Essential Claim(s)
must disclose the information in accordance with
section 6 of the W3C Patent Policy
The following features are at-risk, and may be dropped during the CR period:
The ability to place both emphasis marks and ruby on the same base text.
“At-risk” is a W3C Process term-of-art, and does not necessarily imply that the feature is in danger of being dropped or delayed. It means that the WG believes the feature may have difficulty being interoperably implemented in a timely manner, and marking it as such allows the WG to drop the feature if necessary when transitioning to the Proposed Rec stage, without having to publish a new Candidate Rec without the feature first.
1.
Introduction
This subsection is non-normative.
This module covers text decoration, i.e. decorating the glyphs
of the text once typeset according to font and typographic rules.
(See
[CSS-TEXT-3]
and
[CSS-FONTS-3]
.)
Such features are traditionally used not only for purely decorative purposes,
but also in some cases to show emphasis, for honorifics,
and to indicate editorial changes such as insertions, deletions, and misspellings.
CSS Levels 1 and 2 only defined very basic
line decorations
(underlines, overlines, and strike-throughs)
appropriate to Western typographical traditions.
Level 3 of this module adds the ability to change
the color, style, position, and continuity of these decorations,
and also introduces
emphasis marks
(traditionally used in East Asian typography),
and
shadows
(which were proposed then deferred from Level 2).
1.1.
Module Interactions
This module replaces and extends the text-decorating
features defined in
[CSS2]
chapter 16.
1.2.
Value Definitions
This specification follows the
CSS property definition conventions
from
[CSS2]
using the
value definition syntax
from
[CSS-VALUES-3]
Value types not defined in this specification are defined in CSS Values & Units
[CSS-VALUES-3]
Combination with other CSS modules may expand the definitions of these value types.
In addition to the property-specific values listed in their definitions,
all properties defined in this specification
also accept the
CSS-wide keywords
as their property value.
For readability they have not been repeated explicitly.
1.3.
Terminology
The terms
character
letter
, and
content language
as used in this specification are defined in
[CSS-TEXT-3]
Other terminology and concepts used in this specification are defined
in
[CSS2]
and
[CSS-WRITING-MODES-4]
2.
Line Decoration: Underline, Overline, and Strike-Through
The following properties describe line decorations that are added to the content of an element.
When specified on or propagated to an
inline box
that
box
becomes a
decorating box
for that decoration,
applying the decoration to all its
fragments
The decoration is then further propagated to any
in-flow
block-level
boxes that split the inline
(see
CSS2.1 section 9.2.1.1
).
When specified on or propagated to a
block container
that establishes an
inline formatting context
the decorations are propagated to an
anonymous
inline box that wraps all the
in-flow
inline-level
children of the
block container
When specified on or propagated to a
ruby container
the decorations are propagated only to the
ruby base
For all other box types,
the decorations are propagated to all in-flow children.
Note that text decorations are not propagated to any out-of-flow descendants,
nor to the contents of atomic inline-level descendants such as inline blocks and inline tables.
They are also not propagated to inline children of inline boxes,
although the decoration is
applied
to such boxes.
Underlines, overlines, and line-throughs are drawn only for
non-replaced
inline boxes
and are drawn across all text (including white space, letter spacing, and word spacing)
except spacing (white space, letter spacing, and word spacing) at the beginning and end of a line.
Atomic inlines
, such as images and inline blocks, are not decorated.
Margins, borders, and padding of the
decorating box
are always skipped,
however the margins, border, and padding of descendant
inline boxes
are not.
Note that CSS 2.1 required skipping margins, borders, and padding always.
In this level, by default only the margins, borders, and padding of the
decorating box
are skipped.
In the future CSS2.1 may be updated to match this new default.
Also, control over decorating leading/trailing spaces is expected in Level 4,
and will be applied by default to the HTML
ins
and
del
elements.
UAs
may
interrupt underlines and overlines where the line would cross glyph ink
and to some distance to either side of the glyph outline;
this behavior is not controllable in this level,
but will be further defined in Level 4.
Line-throughs must remain continuous, however.
Skipping Glyph Ink
When the UA interrupts underlines or overlines at glyph boundaries,
the shape of the line at that boundary should
follow the shape of the glyph.
Note, this specification intentionally does not mandate a particular method
for “following the shape” of the glyph
so that UAs can take appropriate measures to handle
aesthetic and performance considerations.
For example,
a UA could assume square line endings below a certain size threshold
for performance reasons;
or use trapezoidal endings to approximate curves,
especially on thinner line decorations.
In terms of aesthetic considerations,
the UA might also consider what happens when the glyph boundary
intersects only part of the line thickness
or is slanted close to the horizontal—
following the curve exactly
could result in typographically-awkward wisps of underline.
Whether to show the line within enclosed areas of a glyph is yet
another consideration.
Hiding the portion of the underline within the bowl gives a cleaner look to the type,
while the curved ends of the underline outside it
suggest the continuity of the underline through the letter
by hugging its outer contour.
Relatively positioning a descendant moves all text decorations
applied to it along with the descendant’s text; it does not affect
calculation of the decoration’s initial position on that line.
The
visibility
property,
text-shadow
, filters, and other graphical transformations
likewise also affect all text decorations applied to that box—
including decorations propagated from an ancestor box—
and do not affect the calculation of their initial positions or thicknesses.
(In the case of line decorations drawn over an atomic inline
or across the margins/borders/padding of a non-replaced inline box,
they are analogously associated with the affected atomic inline / non-replaced inline box
rather than with the
decorating box
.)
In the following style sheet and document fragment:
blockquote { text-decoration: underline; color: blue; }
em { display: block; }
cite { color: fuchsia; }
Help, help!
I am under a hat!—GwieF
...the underlining for the blockquote element is propagated to an
anonymous inline box that surrounds the span element, causing
the text "Help, help!" to be blue, with the blue underlining from
the anonymous inline underneath it, the color being taken from the
blockquote element. The
text
in the em block is also underlined, as it is in an in-flow block to
which the underline is propagated. The final line of text is fuchsia,
but the underline underneath it is still the blue underline from the
anonymous inline element.
This diagram shows the boxes involved in the example above. The
rounded aqua line represents the anonymous inline element wrapping
the inline contents of the paragraph element, the rounded blue line
represents the span element, and the orange lines represent the
blocks.
Note:
Line decorations are propagated through the box tree,
not through inheritance,
and thus have no effect on descendants
when specified on an element with
display: contents
2.1.
Text Decoration Lines: the
text-decoration-line
property
Name:
text-decoration-line
Value:
none
[ underline
||
overline
||
line-through
||
blink ]
Initial:
none
Applies to:
all elements
Inherited:
no (but see prose, above)
Percentages:
n/a
Computed value:
specified keyword(s)
Canonical order:
per grammar
Animation type:
discrete
Specifies what line decorations, if any, are added to the element.
Values have the following meanings:
none
Neither produces nor inhibits text decoration.
underline
Each line of text is underlined.
overline
Each line of text has a line over it (i.e. on the opposite
side from an underline).
line-through
Each line of text has a line through the middle.
blink
The text blinks (alternates between visible and invisible).
Conforming user agents may simply not blink the text.
Note that not blinking the text is one technique to satisfy
checkpoint 3.3 of WAI-UAAG
This value is
deprecated
in favor of Animations
[CSS-ANIMATIONS-1]
Note:
In
vertical writing modes
text-underline-position
can cause the underline and overline to switch sides.
This allows the position of underlines to key off of language-specific preferences
automatically.
2.2.
Text Decoration Style: the
text-decoration-style
property
Name:
text-decoration-style
Value:
solid
double
dotted
dashed
wavy
Initial:
solid
Applies to:
all elements
Inherited:
no
Percentages:
n/a
Computed value:
specified keyword
Canonical order:
per grammar
Animation type:
discrete
This property specifies the style of the line(s) drawn for
text decoration specified on the element. Values have the
same meaning as for the
border-style
properties
[CSS-BACKGROUNDS-3]
wavy
indicates a wavy line.
The style of text decorations must remain the same on all decorations originating from a given element,
even if descendant boxes have different specified styles.
2.3.
Text Decoration Color: the
text-decoration-color
property
Name:
text-decoration-color
Value:
Initial:
currentcolor
Applies to:
all elements
Inherited:
no
Percentages:
n/a
Computed value:
computed color
Canonical order:
per grammar
Animation type:
by computed value type
This property specifies the color of text decoration (underlines
overlines, and line-throughs) set on the element with
text-decoration-line
The color of text decorations must remain the same on all decorations originating from a given element,
even if descendant boxes have different specified colors.
2.4.
Text Decoration Shorthand: the
text-decoration
property
Name:
text-decoration
Value:
<'text-decoration-line'>
||
<'text-decoration-style'>
||
<'text-decoration-color'>
Initial:
see individual properties
Applies to:
see individual properties
Inherited:
see individual properties
Percentages:
see individual properties
Computed value:
see individual properties
Animation type:
see individual properties
Canonical order:
per grammar
This property is a shorthand for setting
text-decoration-line
text-decoration-color
and
text-decoration-style
in one declaration.
Omitted values are set to their initial values.
Note:
text-decoration
declaration that omits
both the
text-decoration-color
and
text-decoration-style
values
is backwards-compatible with CSS Levels 1 and 2.
The following example underlines unvisited links with a solid blue
underline in CSS1 and CSS2 UAs and a navy dotted underline in CSS3 UAs.
:link {
color: blue;
text-decoration: underline;
text-decoration: navy dotted underline; /*
Ignored
in CSS1/CSS2 UAs */
Note:
The shorthand purposefully omits the
text-underline-position
property,
which is a language/writing-system–dependent setting that keys off the content,
so that it can cascade and inherit independently
from the (uninherited) stylistic settings of the
text-decoration
shorthand.
2.5.
Text Underline Position: the
text-underline-position
property
Name:
text-underline-position
Value:
auto
[ under
||
[ left
right ] ]
Initial:
auto
Applies to:
all elements
Inherited:
yes
Percentages:
n/a
Computed value:
specified keyword(s)
Canonical order:
per grammar
Animation type:
discrete
This property sets the position of an underline specified on the element.
(It does not affect underlines specified by ancestor elements.)
If
left
or
right
is specified alone,
auto
is also implied.
The following example styles modern Chinese, Japanese, and Korean
texts with the appropriate underline positions in both horizontal
and vertical text:
:root:lang(ja), [lang|=ja], :root:lang(ko), [lang|=ko] { text-underline-position: under right; }
:root:lang(zh), [lang|=zh] { text-underline-position: under left; }
Values have the following meanings:
auto
The user agent may use any algorithm to determine the
underline’s position; however it must be placed at or under
the alphabetic baseline.
Note:
It is suggested that the default underline position
be close to the alphabetic baseline,
unless that would either cross subscripted (or otherwise lowered) text
or draw over glyphs from Asian scripts such as Han or Tibetan
for which an alphabetic underline is too high:
in such cases, shifting the underline lower
or aligning to the em box edge as described for
under
may be more appropriate.
A typical “alphabetic” underline is positioned just below the alphabetic baseline
under
The underline is positioned
under
the element’s text content.
In this case the underline usually does not cross the descenders.
(This is sometimes called “accounting” underline.)
This value can be combined with
left
or
right
if a particular side is preferred in vertical
typographic modes
text-underline-position: under
Because
text-underline-position
inherits, and is not reset
by the
text-decoration
shorthand, the following example
switches the document to use
under
underlining, which can
be more appropriate for writing systems with long, complicated
descenders. It is also often useful for mathematical or chemical
texts that use many subscripts.
:root { text-underline-position: under; }
Note:
The
under
value does not guarantee
that the underline will not conflict with glyphs,
as some fonts have descenders or diacritics
that extend below the font’s descent metrics.
left
In vertical
typographic modes
, the underline is aligned as for
under
, except it is always aligned to the left edge of the text.
If this causes the underline to be drawn on the "over" side of
the text, then an overline also switches sides and is drawn on
the "under" side.
right
In vertical
typographic modes
, the underline is aligned as for
under
, except it is always aligned to the right edge of the text.
If this causes the underline to be drawn on the "over" side of
the text, then an overline also switches sides and is drawn on
the "under" side.
left
right
In vertical
typographic modes
, the
text-underline-position
values
left
and
right
allow placing the underline on either
side of the text. (In horizontal
typographic modes
, both values are
treated as
auto
.)
The exact position and thickness of line decorations is UA-defined in this level.
However, for underlines and overlines
the UA must use a single thickness and position on each line
for the decorations deriving from a single
decorating box
vs.
Correct and incorrect rendering of
ABCD
Note, since line decorations can span elements with varying font sizes and
vertical alignments, the best position for a line decoration is not
necessarily the ideal position dictated by the
decorating box
For example, an overline positioned to a small font
will effectively become a line-through if the element contains text in a significantly larger font-size.
Even for underlines, if the text is not aligned to the alphabetic baseline
(for example, in vertical typesetting styles,
text is aligned by its central baseline by default
[CSS-WRITING-MODES-4]
an underline will cut through descendant text of a larger font-size.
UA consideration of descendant content will therefore result in better typography.
Due to the central baseline alignment of vertical text,
a left-side underline on small vertical text will cut through the text
of a child with a larger font size.
The underline is not allowed to be broken,
but adjusting its position further to the left
properly accommodates all of the underlined text.
UAs
must
adjust line positions
to match the shifted metrics of
decorating boxes
shifted
with
vertical-align
values other than
baseline
[CSS2]
or subscripted/superscripted via
font-variant-position
[CSS-FONTS-3]
but
must not
adjust the line position or thickness
in response to descendants of a
decorating box
that are so styled.
This allows superscripts and subscripts to be properly decorated
(underlined, struck through, etc.)
but prevents them from distorting or breaking the positioning of such decorations on their ancestors.
Example of underline applied to
superscripted text
vs. underline applied to
text containing a superscript
Some font formats (such as OpenType) can offer information
about the appropriate position of a line decoration.
The UA should use such information
(such as the underline thickness,
or appropriate alphabetic underline position)
from the font wherever appropriate.
Note:
Typically, OpenType font metrics give the position
of an
alphabetic
underline;
in some cases (especially in CJK fonts),
it gives the position of a
under left
underline.
(In this case, the font’s underline metrics typically
touch the bottom edge of the em box).
The UA may but is not required to correct for incorrect font metrics.
3.
Emphasis Marks
East Asian documents traditionally use small symbols next to each glyph to emphasize
a run of text. For example:
Accent emphasis (shown in blue for clarity) applied to Japanese text
The
text-emphasis
shorthand, and its
text-emphasis-style
and
text-emphasis-color
longhands,
can be used to apply such marks to the text.
The
text-emphasis-position
property, which inherits separately,
allows setting the emphasis marks’ position with respect to the text.
3.1.
Emphasis Mark Style: the
text-emphasis-style
property
Name:
text-emphasis-style
Value:
none
[ [ filled
open ]
||
[ dot
circle
double-circle
triangle
sesame ] ]
Initial:
none
Applies to:
text
Inherited:
yes
Percentages:
n/a
Computed value:
the keyword
none
, a pair of keywords representing the shape and fill, or a string
Canonical order:
per grammar
Animation type:
discrete
This property applies emphasis marks to the element’s text.
Values have the following meanings:
none
No emphasis marks.
filled
The shape is filled with solid color.
open
The shape is hollow.
dot
Display small circles as marks.
The filled dot is U+2022 '•', and the open dot is U+25E6 '◦'.
circle
Display large circles as marks.
The filled circle is U+25CF '●', and the open circle is U+25CB '○'.
double-circle
Display double circles as marks.
The filled double-circle is U+25C9 '◉', and the open double-circle is U+25CE '◎'.
triangle
Display triangles as marks.
The filled triangle is U+25B2 '▲', and the open triangle is U+25B3 '△'.
sesame
Display sesames as marks.
The filled sesame is U+FE45 '﹅', and the open sesame is U+FE46 '﹆'.
Display the given string as marks.
Authors should not specify more than one
character
in
The UA may truncate or ignore strings consisting of more than one grapheme cluster.
If a shape keyword is specified but neither of
filled
nor
open
is
specified,
filled
is assumed. If only
filled
or
open
is specified,
the shape keyword computes to
circle
in horizontal
typographic modes
and
sesame
in vertical
typographic modes
The marks should be drawn using the element’s font settings
with the addition of the
ruby
feature
and the size scaled down 50%.
However, since not all fonts have all these glyphs,
and some fonts use inappropriate sizes for emphasis marks in these code points,
the UA may opt to use a font known to be good for emphasis marks,
or the marks may instead be synthesized by the UA.
Marks must remain upright in vertical
typographic modes
like CJK characters, they do not rotate to match the writing mode.
The orientation of marks in horizontal
typographic modes
of vertical
writing modes
is undefined in this level
(but may be defined in a future level if definitive use cases arise).
Note:
One example of good fonts for emphasis marks is Adobe’s open source
Kenten Generic OpenType Font
which is specially designed for the emphasis marks.
The marks are drawn once for each
typographic character unit
However, emphasis marks are
not
drawn for:
Word separators
or other
characters
that
belong to the Unicode separator classes (Z*).
(But note that emphasis marks
are
drawn for a space
that combines with any combining characters.)
Punctuation--specifically,
any
characters
that belong to the
Unicode P*
general category
and
do not
NFKD
normalize
[UAX15]
to
any of the following symbols:
U+0023
NUMBER SIGN
U+0025
PERCENT SIGN
U+2030
PER MILLE SIGN
U+2031
PER TEN THOUSAND SIGN
U+066A
ARABIC PERCENT SIGN
U+0609
ARABIC-INDIC PER MILLE SIGN
U+060A
ARABIC-INDIC PER TEN THOUSAND SIGN
U+0026
AMPERSAND
U+204A
TIRONIAN SIGN ET
U+0040
COMMERCIAL AT
U+00A7
SECTION SIGN
U+00B6
PILCROW SIGN
U+204B
REVERSED PILCROW SIGN
U+2053
SWUNG DASH
〽️
U+303D
PART ALTERNATION MARK
Characters belonging to the Unicode classes for control codes
and unassigned characters (Cc, Cf, Cn).
Note:
Control over which characters are marked will be added in Level 4.
(The list of punctuation may also be further refined,
particularly for non-CJK punctuation.)
3.2.
Emphasis Mark Color: the
text-emphasis-color
property
Name:
text-emphasis-color
Value:
Initial:
currentcolor
Applies to:
text
Inherited:
yes
Percentages:
n/a
Computed value:
computed color
Canonical order:
per grammar
Animation type:
by computed value type
This property specifies the foreground color of the emphasis marks.
Note:
currentcolor
keyword computes to itself
and is resolved to the value of
color
after inheritance is performed.
This means
text-emphasis-color
by default matches the text
color
even as
color
changes across elements.
3.3.
Emphasis Mark Shorthand: the
text-emphasis
property
Name:
text-emphasis
Value:
<'text-emphasis-style'>
||
<'text-emphasis-color'>
Initial:
see individual properties
Applies to:
see individual properties
Inherited:
see individual properties
Percentages:
see individual properties
Computed value:
see individual properties
Animation type:
see individual properties
Canonical order:
per grammar
This property is a shorthand for setting
text-emphasis-style
and
text-emphasis-color
in one declaration.
Omitted values are set to their initial values.
Note that
text-emphasis-position
is not reset in this
shorthand. This is because typically the shape and color vary, but the
position is consistent for a particular language throughout the document.
Therefore the position should inherit independently.
3.4.
Emphasis Mark Position: the
text-emphasis-position
property
Name:
text-emphasis-position
Value:
[ over
under ]
&&
[ right
left ]
Initial:
over right
Applies to:
text
Inherited:
yes
Percentages:
n/a
Computed value:
specified keyword(s)
Canonical order:
per grammar
Animation type:
discrete
This property describes where emphasis marks are drawn at.
If
[ right | left ]
is omitted, it defaults to
right
The values have following meanings:
over
Draw marks over the text in horizontal
typographic modes
under
Draw marks under the text in horizontal
typographic modes
right
Draw marks to the right of the text in vertical
typographic modes
left
Draw marks to the left of the text in vertical
typographic modes
Emphasis marks are drawn exactly as if each character was
assigned the mark as its ruby annotation text with the ruby position
given by
text-emphasis-position
and the ruby alignment as centered.
Note that this position may be adjusted if it would conflict
with underline or overline decorations.
The effect of emphasis marks on the line height is the same as for
ruby text.
Note, the preferred position of emphasis marks depends on the
language. In Japanese for example, the preferred position is
over right
. In Chinese, on the other hand, the preferred
position is
under right
The informative table below summarizes the preferred
emphasis mark positions for Chinese and Japanese:
Preferred emphasis mark and ruby position
Language
Preferred position
Illustration
Horizontal
Vertical
Japanese
over
right
Korean
Mongolian
Chinese
under
right
If emphasis marks are applied to characters
for which ruby is drawn in the same position as the emphasis mark,
the emphasis marks are placed outside the ruby.
This includes
auto-hidden
and empty
ruby annotations
Emphasis marks applied to 4 characters, with ruby also on 2 of them
Some editors prefer to hide emphasis marks when they conflict with ruby.
In HTML, this can be done with the following style rule:
ruby { text-emphasis: none; }
Some other editors prefer to hide ruby when they conflict with emphasis marks.
In HTML, this can be done with the following pattern:
em { text-emphasis: dot; } /* Set text-emphasis for elements */
em rt { display: none; } /* Hide ruby inside elements */
4.
Text Shadows: the
text-shadow
property
Name:
text-shadow
Value:
none
&&
{2,3}
Initial:
none
Applies to:
text
Inherited:
yes
Percentages:
n/a
Computed value:
either the keyword
none
or
a list, each item consisting of three absolute lengths
plus a computed color
Canonical order:
per grammar
Animation type:
as shadow list
This property accepts a comma-separated list of shadow effects
to be applied to the text of the element.
Values are interpreted as for
box-shadow
[CSS-BACKGROUNDS-3]
(But note that spread values and the
inset
keyword are not allowed.)
Each layer shadows the element’s text and all its text decorations
(composited together).
The shadow effects are applied front-to-back:
the first shadow is on top.
The shadows may thus overlay each other,
but they never overlay the text itself.
The shadow must be painted at a stack level
between the element’s border and/or background (if present)
and the elements text and text decoration.
UAs should avoid painting text shadows over text
in adjacent elements belonging to the same stack level and stacking context.
(This may mean that the exact stack level of the shadows depends
on whether the element has a border or background:
the exact stacking behavior of text shadows is thus UA-defined.)
It is undefined whether a given shadow layer shadows
each glyph or decoration independently
or if the text and/or decorations are flattened and then shadowed.
Unlike
box-shadow
, text shadows are not clipped to the shadowed shape
and may show through if the text is partially-transparent.
Like
box-shadow
, text shadows do not influence layout,
and do not trigger scrolling
or increase the size of the
scrollable overflow area
Note:
The painting order of shadows defined here is the opposite
of that defined in the 1998
CSS2 Recommendation
The
text-shadow
property applies to both the
::first-line
and
::first-letter
pseudo-elements.
5.
Painting Text Decorations
5.1.
Painting Order of Text Decorations
As in
[CSS2]
, text decorations are drawn immediately over/under the text they decorate,
in the following order (bottommost first):
shadows (
text-shadow
underlines (
text-decoration
overlines (
text-decoration
text
emphasis marks (
text-emphasis
line-through (
text-decoration
Where line decorations are drawn across box decorations or atomic inlines,
they are drawn over non-positioned content and just below any positioned descendants
(immediately below layer #8 in CSS2.1 Appendix E).
5.2.
Overflow of Text Decorations
Text decorations that leak outside a
box
are considered
ink overflow
they do not extend the
scrollable overflow area
[css-overflow-3]
Appendix A: Acknowledgements
This specification would not have been possible without the help from:
Ayman Aldahleh, Bert Bos, Tantek Çelik, Stephen Deach, John Daggett,
Martin Dürst,
Laurie Anna Edlund, Ben Errez, Yaniv Feinberg, Arye Gittelman, Ian
Hickson, Martin Heijdra, Richard Ishida, Masayasu Ishikawa,
Michael Jochimsen, Eric LeVine, Ambrose Li, Håkon Wium Lie, Chris Lilley,
Ken Lunde, Nat McCully, Shinyu Murakami, Paul Nelson, Chris Pratley, Marcin Sawicki,
Arnold Schrijver, Rahul Sonnad, Michel Suignard, Takao Suzuki,
Frank Tang, Chris Thrasher, Etan Wexler, Chris Wilson, Masafumi Yabe
and Steve Zilles.
Appendix B: Default UA Stylesheet
This appendix is informative,
and is to help UA developers to implement default stylesheet,
but UA developers are free to ignore or change.
/* typical styling of HTML */
blink {
text-decoration-line: blink;
s, strike, del {
text-decoration: line-through;
u, ins, :link, :visited {
text-decoration: underline;
abbr[title], acronym[title] {
text-decoration: dotted underline;
/* disable inheritance of text-emphasis marks to ruby text:
emphasis marks should only apply to base text */
rt { text-emphasis: none; }
/* set language-appropriate default emphasis mark position */
:root:lang(zh), [lang|=zh] { text-emphasis-position: under right; }
[lang|=ja], [lang|=ko] { text-emphasis-position: over right; }
/* set language-appropriate default underline position */
:root:lang(ja), [lang|=ja],
:root:lang(mn), [lang|=mn],
:root:lang(ko), [lang|=ko] { text-underline-position: right; }
:root:lang(zh), [lang|=zh] { text-underline-position: left; }
/* auto is chosen (implied) above instead of under
due to content-compatibility concerns */
If you find any issues, recommendations to add, or corrections,
please send the information to
www-style@w3.org
with
[css-text-decor]
in the subject line.
While
text-decoration-line: blink
can’t be fully reproduced with other existing properties,
authors can achieve a very similar effect with the following CSS:
@keyframes blink {
0% {
visibility: hidden;
animation-timing-function: step-end;
25%, 100% {
visibility: visible;
blink {
animation: blink 1s infinite;
Appendix C:
Changes
Changes since the
August 2019 Candidate Recommendation
Changes include:
Clarify that
text-shadow
animates as a
shadow list
like
box-shadow
Issue 4375
Be explicit about properties that apply to text.
Issue 5303
Minor editorial fixes.
Changes since the
July 2018 Candidate Recommendation
Changes include:
Clarified that text decoration overflow is
ink overflow
Issue 3272
Fixed inconsistencies in sample
text-underline-position
rules.
Issue 3441
Cleaned up “Computed value” lines to match new conventions.
Disposition of Comments
is available.
Changes since the
August 2013 Candidate Recommendation
Significant changes include:
Deferred
text-decoration-skip
to Level 4 to allow for major changes.
Defined behavioral defaults in prose.
Issue 1
Issue 22
Issue 26
Specified that line-throughs are unaffected by ink-skipping feature.
Issue 24
Recommended that when ink is skipped, line endings conform to the glyph shape.
Issue 30
Updated writing-mode–sensitive conditions to depend on
typographic mode
to account for addition of
sideways-lr
and
sideways-rl
values to
writing-mode
property.
Marked orientation of emphasis marks under
sideways-lr
and
sideways-rl
undefined.
Issue 10
Issue 20
Made
[ right | left ]
option of
text-emphasis-position
optional,
defaulting to
right
Issue 17
Made
text-underline-position
imply
auto
instead of
under
when only
left
or
right
is specified.
Issue 18
Changed text decoration to skip leading and trailing spaces.
Issue 6
Noted that the positions of ruby annotations may be adjusted
to avoid conflicts with text decorations.
Issue 21
Changed initial value of
text-shadow
to be
currentColor
Issue 28
Fixed error in “Computed value” line for
text-shadow
Issue 7
Fixed canonical order of
text-shadow
values to match implementations.
Issue 35
Defined positioning of emphasis marks with respect to auto-hidden and empty ruby annotations.
Issue 9
If emphasis marks are applied to characters
for which ruby is drawn in the same position as the emphasis mark,
the emphasis marks are placed outside the ruby.
This includes
auto-hidden
and empty
ruby annotations
Made
text-emphasis
skip punctuation by default.
Issue 16
Added rule to apply
ruby
to emphasis marks' font.
Issue 13
Various corrections and improvements to the default UA rules
for
text-emphasis-position
and
text-underline-position
Issue 11
Issue 12
Issue 18
Issue 19
Issue 36
Conformance
Document conventions
Conformance requirements are expressed with a combination of
descriptive assertions and RFC 2119 terminology. The key words “MUST”,
“MUST NOT”, “REQUIRED”, “SHALL”, “SHALL NOT”, “SHOULD”, “SHOULD NOT”,
“RECOMMENDED”, “MAY”, and “OPTIONAL” in the normative parts of this
document are to be interpreted as described in RFC 2119.
However, for readability, these words do not appear in all uppercase
letters in this specification.
All of the text of this specification is normative except sections
explicitly marked as non-normative, examples, and notes.
[RFC2119]
Examples in this specification are introduced with the words “for example”
or are set apart from the normative text with
class="example"
like this:
This is an example of an informative example.
Informative notes begin with the word “Note” and are set apart from the
normative text with
class="note"
, like this:
Note, this is an informative note.
Advisements are normative sections styled to evoke special attention and are
set apart from other normative text with
, like
this:
UAs MUST provide an accessible alternative.
Conformance classes
Conformance to this specification
is defined for three conformance classes:
style sheet
CSS
style sheet
renderer
UA
that interprets the semantics of a style sheet and renders
documents that use them.
authoring tool
UA
that writes a style sheet.
A style sheet is conformant to this specification
if all of its statements that use syntax defined in this module are valid
according to the generic CSS grammar and the individual grammars of each
feature defined in this module.
A renderer is conformant to this specification
if, in addition to interpreting the style sheet as defined by the
appropriate specifications, it supports all the features defined
by this specification by parsing them correctly
and rendering the document accordingly. However, the inability of a
UA to correctly render a document due to limitations of the device
does not make the UA non-conformant. (For example, a UA is not
required to render color on a monochrome monitor.)
An authoring tool is conformant to this specification
if it writes style sheets that are syntactically correct according to the
generic CSS grammar and the individual grammars of each feature in
this module, and meet all other conformance requirements of style sheets
as described in this module.
Partial implementations
So that authors can exploit the forward-compatible parsing rules to
assign fallback values, CSS renderers
must
treat as invalid (and
ignore
as appropriate
) any at-rules, properties, property values, keywords,
and other syntactic constructs for which they have no usable level of
support. In particular, user agents
must not
selectively
ignore unsupported component values and honor supported values in a single
multi-value property declaration: if any value is considered invalid
(as unsupported values must be), CSS requires that the entire declaration
be ignored.
Implementations of Unstable and Proprietary Features
To avoid clashes with future stable CSS features,
the CSSWG recommends
following best practices
for the implementation of
unstable
features and
proprietary extensions
to CSS.
Non-experimental implementations
Once a specification reaches the Candidate Recommendation stage,
non-experimental implementations are possible, and implementors should
release an unprefixed implementation of any CR-level feature they
can demonstrate to be correctly implemented according to spec.
To establish and maintain the interoperability of CSS across
implementations, the CSS Working Group requests that non-experimental
CSS renderers submit an implementation report (and, if necessary, the
testcases used for that implementation report) to the W3C before
releasing an unprefixed implementation of any CSS features. Testcases
submitted to W3C are subject to review and correction by the CSS
Working Group.
Further information on submitting testcases and implementation reports
can be found from on the CSS Working Group’s website at
Questions should be directed to the
public-css-testsuite@w3.org
mailing list.
CR exit criteria
For this specification to be advanced to Proposed Recommendation,
there must be at least two independent, interoperable implementations
of each feature. Each feature may be implemented by a different set of
products, there is no requirement that all features be implemented by
a single product. For the purposes of this criterion, we define the
following terms:
independent
each implementation must be developed by a
different party and cannot share, reuse, or derive from code
used by another qualifying implementation. Sections of code that
have no bearing on the implementation of this specification are
exempt from this requirement.
interoperable
passing the respective test case(s) in the
official CSS test suite, or, if the implementation is not a Web
browser, an equivalent test. Every relevant test in the test
suite should have an equivalent test created if such a user
agent (UA) is to be used to claim interoperability. In addition
if such a UA is to be used to claim interoperability, then there
must one or more additional UAs which can also pass those
equivalent tests in the same way for the purpose of
interoperability. The equivalent tests must be made publicly
available for the purposes of peer review.
implementation
a user agent which:
implements the specification.
is available to the general public. The implementation may
be a shipping product or other publicly available version
(i.e., beta version, preview release, or "nightly build").
Non-shipping product releases must have implemented the
feature(s) for a period of at least one month in order to
demonstrate stability.
is not experimental (i.e., a version specifically designed
to pass the test suite and is not intended for normal usage
going forward).
The specification will remain Candidate Recommendation for at least
six months.
Index
Terms defined by this specification
auto
, in § 2.5
blink
, in § 2.1
circle
, in § 3.1
decorating box
, in § 2
dot
, in § 3.1
double-circle
, in § 3.1
filled
, in § 3.1
left
value for text-emphasis-position
, in § 3.4
value for text-underline-position
, in § 2.5
line-through
, in § 2.1
none
value for text-decoration-line
, in § 2.1
value for text-emphasis-style
, in § 3.1
open
, in § 3.1
over
, in § 3.4
overline
, in § 2.1
right
value for text-emphasis-position
, in § 3.4
value for text-underline-position
, in § 2.5
sesame
, in § 3.1
, in § 3.1
text-decoration
, in § 2.4
text-decoration-color
, in § 2.3
text-decoration-line
, in § 2.1
text-decoration-style
, in § 2.2
text-emphasis
, in § 3.3
text-emphasis-color
, in § 3.2
text-emphasis-position
, in § 3.4
text-emphasis-style
, in § 3.1
text-shadow
, in § 4
text-underline-position
, in § 2.5
triangle
, in § 3.1
under
value for text-emphasis-position
, in § 3.4
value for text-underline-position
, in § 2.5
underline
, in § 2.1
Referenced in:
4.
Text Shadows: the text-shadow property
(2)
(3)
Changes since the August 2019 Candidate Recommendation
Referenced in:
4.
Text Shadows: the text-shadow property
Referenced in:
4.
Text Shadows: the text-shadow property
Referenced in:
2.
Line Decoration: Underline, Overline, and Strike-Through
Referenced in:
3.2.
Emphasis Mark Color: the text-emphasis-color property
(2)
(3)
Referenced in:
2.3.
Text Decoration Color: the text-decoration-color property
3.2.
Emphasis Mark Color: the text-emphasis-color property
4.
Text Shadows: the text-shadow property
Referenced in:
3.2.
Emphasis Mark Color: the text-emphasis-color property
Referenced in:
2.
Line Decoration: Underline, Overline, and Strike-Through
Referenced in:
2.
Line Decoration: Underline, Overline, and Strike-Through
Referenced in:
2.
Line Decoration: Underline, Overline, and Strike-Through
(2)
Referenced in:
2.
Line Decoration: Underline, Overline, and Strike-Through
Referenced in:
2.
Line Decoration: Underline, Overline, and Strike-Through
5.2.
Overflow of Text Decorations
Referenced in:
2.
Line Decoration: Underline, Overline, and Strike-Through
Referenced in:
2.
Line Decoration: Underline, Overline, and Strike-Through
(2)
Referenced in:
2.
Line Decoration: Underline, Overline, and Strike-Through
(2)
(3)
Referenced in:
2.
Line Decoration: Underline, Overline, and Strike-Through
Referenced in:
2.
Line Decoration: Underline, Overline, and Strike-Through
Referenced in:
2.
Line Decoration: Underline, Overline, and Strike-Through
Referenced in:
2.
Line Decoration: Underline, Overline, and Strike-Through
Referenced in:
2.5.
Text Underline Position: the text-underline-position property
Referenced in:
3.1.
Emphasis Mark Style: the text-emphasis-style property
Changes since the August 2013 Candidate Recommendation
Referenced in:
2.5.
Text Underline Position: the text-underline-position property
Referenced in:
2.5.
Text Underline Position: the text-underline-position property
Referenced in:
5.2.
Overflow of Text Decorations
Changes since the July 2018 Candidate Recommendation
Referenced in:
4.
Text Shadows: the text-shadow property
5.2.
Overflow of Text Decorations
Referenced in:
3.4.
Emphasis Mark Position: the text-emphasis-position property
Changes since the August 2013 Candidate Recommendation
Referenced in:
2.
Line Decoration: Underline, Overline, and Strike-Through
Referenced in:
2.
Line Decoration: Underline, Overline, and Strike-Through
Referenced in:
3.1.
Emphasis Mark Style: the text-emphasis-style property
(2)
(3)
Referenced in:
3.1.
Emphasis Mark Style: the text-emphasis-style property
Referenced in:
3.1.
Emphasis Mark Style: the text-emphasis-style property
Referenced in:
2.2.
Text Decoration Style: the text-decoration-style property
Referenced in:
4.
Text Shadows: the text-shadow property
Referenced in:
3.4.
Emphasis Mark Position: the text-emphasis-position property
4.
Text Shadows: the text-shadow property
Referenced in:
4.
Text Shadows: the text-shadow property
Referenced in:
3.1.
Emphasis Mark Style: the text-emphasis-style property
(2)
Referenced in:
3.4.
Emphasis Mark Position: the text-emphasis-position property
4.
Text Shadows: the text-shadow property
Referenced in:
1.2.
Value Definitions
Referenced in:
4.
Text Shadows: the text-shadow property
Referenced in:
2.1.
Text Decoration Lines: the text-decoration-line property
2.2.
Text Decoration Style: the text-decoration-style property
(2)
(3)
(4)
2.5.
Text Underline Position: the text-underline-position property
(2)
3.1.
Emphasis Mark Style: the text-emphasis-style property
(2)
(3)
(4)
(5)
(6)
(7)
3.4.
Emphasis Mark Position: the text-emphasis-position property
(2)
4.
Text Shadows: the text-shadow property
Referenced in:
2.1.
Text Decoration Lines: the text-decoration-line property
(2)
(3)
2.4.
Text Decoration Shorthand: the text-decoration property
(2)
2.5.
Text Underline Position: the text-underline-position property
3.1.
Emphasis Mark Style: the text-emphasis-style property
3.3.
Emphasis Mark Shorthand: the text-emphasis property
Referenced in:
Changes since the August 2013 Candidate Recommendation
(2)
Referenced in:
Changes since the August 2013 Candidate Recommendation
(2)
Referenced in:
2.5.
Text Underline Position: the text-underline-position property
(2)
(3)
(4)
(5)
3.1.
Emphasis Mark Style: the text-emphasis-style property
(2)
(3)
(4)
3.4.
Emphasis Mark Position: the text-emphasis-position property
(2)
(3)
(4)
Changes since the August 2013 Candidate Recommendation
Referenced in:
2.5.
Text Underline Position: the text-underline-position property
Referenced in:
2.1.
Text Decoration Lines: the text-decoration-line property
Referenced in:
3.1.
Emphasis Mark Style: the text-emphasis-style property
Referenced in:
Changes since the August 2013 Candidate Recommendation
Referenced in:
2.
Line Decoration: Underline, Overline, and Strike-Through
Referenced in:
2.
Line Decoration: Underline, Overline, and Strike-Through
Terms defined by reference
[CSS-BACKGROUNDS-3]
defines the following terms:
box-shadow
inset
none
[css-break-3]
defines the following terms:
fragment
[css-color-3]
defines the following terms:
color
[css-color-4]
defines the following terms:
currentcolor
[css-display-3]
defines the following terms:
anonymous
atomic inline
block container
block-level
box
display
in-flow
inline box
inline formatting context
inline-level
non-replaced
visibility
[css-fonts-4]
defines the following terms:
font-variant-position
ruby
[css-inline-3]
defines the following terms:
baseline
vertical-align
[css-overflow-3]
defines the following terms:
ink overflow
scrollable overflow area
[css-ruby-1]
defines the following terms:
ruby annotation
ruby base
ruby container
[CSS-TEXT-3]
defines the following terms:
character
general category
typographic character unit
[css-text-decor-4]
defines the following terms:
wavy
[css-values-4]
defines the following terms:
&&
css-wide keywords
{a,b}
||
[CSS-WRITING-MODES-4]
defines the following terms:
sideways-lr
sideways-rl
typographic mode
under
vertical writing mode
writing mode
writing-mode
[HTML]
defines the following terms:
del
ins
References
Normative References
[CSS-BACKGROUNDS-3]
Bert Bos; Elika Etemad; Brad Kemper.
CSS Backgrounds and Borders Module Level 3
. 26 July 2021. CR. URL:
[CSS-BREAK-3]
Rossen Atanassov; Elika Etemad.
CSS Fragmentation Module Level 3
. 4 December 2018. CR. URL:
[CSS-COLOR-4]
Tab Atkins Jr.; Chris Lilley; Lea Verou.
CSS Color Module Level 4
. 15 December 2021. WD. URL:
[CSS-DISPLAY-3]
Tab Atkins Jr.; Elika Etemad.
CSS Display Module Level 3
. 3 September 2021. CR. URL:
[CSS-FONTS-3]
John Daggett; Myles Maxfield; Chris Lilley.
CSS Fonts Module Level 3
. 20 September 2018. REC. URL:
[CSS-FONTS-4]
John Daggett; Myles Maxfield; Chris Lilley.
CSS Fonts Module Level 4
. 21 December 2021. WD. URL:
[CSS-INLINE-3]
Dave Cramer; Elika Etemad; Steve Zilles.
CSS Inline Layout Module Level 3
. 27 August 2020. WD. URL:
[CSS-OVERFLOW-3]
David Baron; Elika Etemad; Florian Rivoal.
CSS Overflow Module Level 3
. 23 December 2021. WD. URL:
[CSS-RUBY-1]
Elika Etemad; et al.
CSS Ruby Annotation Layout Module Level 1
. 2 December 2021. WD. URL:
[CSS-TEXT-3]
Elika Etemad; Koji Ishii; Florian Rivoal.
CSS Text Module Level 3
. 22 April 2021. CR. URL:
[CSS-TEXT-DECOR-4]
Elika Etemad; Koji Ishii.
CSS Text Decoration Module Level 4
. 6 May 2020. WD. URL:
[CSS-VALUES-3]
Tab Atkins Jr.; Elika Etemad.
CSS Values and Units Module Level 3
. 6 June 2019. CR. URL:
[CSS-VALUES-4]
Tab Atkins Jr.; Elika Etemad.
CSS Values and Units Module Level 4
. 16 December 2021. WD. URL:
[CSS-WRITING-MODES-4]
Elika Etemad; Koji Ishii.
CSS Writing Modes Level 4
. 30 July 2019. CR. URL:
[CSS2]
Bert Bos; et al.
Cascading Style Sheets Level 2 Revision 1 (CSS 2.1) Specification
. 7 June 2011. REC. URL:
[RFC2119]
S. Bradner.
Key words for use in RFCs to Indicate Requirement Levels
. March 1997. Best Current Practice. URL:
[UAX15]
Ken Whistler.
Unicode Normalization Forms
. 27 August 2021. Unicode Standard Annex #15. URL:
Informative References
[CSS-ANIMATIONS-1]
Dean Jackson; et al.
CSS Animations Level 1
. 11 October 2018. WD. URL:
[CSS-COLOR-3]
Tantek Çelik; Chris Lilley; David Baron.
CSS Color Module Level 3
. 18 January 2022. REC. URL:
[HTML]
Anne van Kesteren; et al.
HTML Standard
. Living Standard. URL:
Property Index
Name
Value
Initial
Applies to
Inh.
%ages
Animation type
Canonical order
Computed value
text-decoration
<'text-decoration-line'> || <'text-decoration-style'> || <'text-decoration-color'>
see individual properties
see individual properties
see individual properties
see individual properties
see individual properties
per grammar
see individual properties
text-decoration-color
currentcolor
all elements
no
n/a
by computed value type
per grammar
computed color
text-decoration-line
none | [ underline || overline || line-through || blink ]
none
all elements
no (but see prose, above)
n/a
discrete
per grammar
specified keyword(s)
text-decoration-style
solid | double | dotted | dashed | wavy
solid
all elements
no
n/a
discrete
per grammar
specified keyword
text-emphasis
<'text-emphasis-style'> || <'text-emphasis-color'>
see individual properties
see individual properties
see individual properties
see individual properties
see individual properties
per grammar
see individual properties
text-emphasis-color
currentcolor
text
yes
n/a
by computed value type
per grammar
computed color
text-emphasis-position
[ over | under ] && [ right | left ]?
over right
text
yes
n/a
discrete
per grammar
specified keyword(s)
text-emphasis-style
none | [ [ filled | open ] || [ dot | circle | double-circle | triangle | sesame ] ] |
none
text
yes
n/a
discrete
per grammar
the keyword none, a pair of keywords representing the shape and fill, or a string
text-shadow
none | [
none
text
yes
n/a
as shadow list
per grammar
either the keyword none or
a list, each item consisting of three absolute lengths
plus a computed color
text-underline-position
auto | [ under || [ left | right ] ]
auto
all elements
yes
n/a
discrete
per grammar
specified keyword(s)
Issues Index
If you find any issues, recommendations to add, or corrections,
please send the information to
www-style@w3.org
with
[css-text-decor]
in the subject line.
#decorating-box
Referenced in:
2.
Line Decoration: Underline, Overline, and Strike-Through
(2)
(3)
2.5.
Text Underline Position: the text-underline-position property
(2)
(3)
(4)
#propdef-text-decoration-line
Referenced in:
2.1.
Text Decoration Lines: the text-decoration-line property
2.3.
Text Decoration Color: the text-decoration-color property
2.4.
Text Decoration Shorthand: the text-decoration property
(2)
Appendix B: Default UA Stylesheet
#propdef-text-decoration-style
Referenced in:
2.2.
Text Decoration Style: the text-decoration-style property
2.4.
Text Decoration Shorthand: the text-decoration property
(2)
(3)
#propdef-text-decoration-color
Referenced in:
2.3.
Text Decoration Color: the text-decoration-color property
2.4.
Text Decoration Shorthand: the text-decoration property
(2)
(3)
#propdef-text-decoration
Referenced in:
2.4.
Text Decoration Shorthand: the text-decoration property
(2)
(3)
2.5.
Text Underline Position: the text-underline-position property
5.1.
Painting Order of Text Decorations
(2)
(3)
#propdef-text-underline-position
Referenced in:
2.1.
Text Decoration Lines: the text-decoration-line property
2.4.
Text Decoration Shorthand: the text-decoration property
2.5.
Text Underline Position: the text-underline-position property
(2)
(3)
(4)
Changes since the July 2018 Candidate Recommendation
Changes since the August 2013 Candidate Recommendation
(2)
#underline-auto
Referenced in:
2.5.
Text Underline Position: the text-underline-position property
(2)
Changes since the August 2013 Candidate Recommendation
#underline-under
Referenced in:
2.5.
Text Underline Position: the text-underline-position property
(2)
(3)
(4)
Changes since the August 2013 Candidate Recommendation
#underline-left
Referenced in:
2.5.
Text Underline Position: the text-underline-position property
(2)
(3)
(4)
Changes since the August 2013 Candidate Recommendation
#underline-right
Referenced in:
2.5.
Text Underline Position: the text-underline-position property
(2)
(3)
(4)
Changes since the August 2013 Candidate Recommendation
#propdef-text-emphasis-style
Referenced in:
3.
Emphasis Marks
3.1.
Emphasis Mark Style: the text-emphasis-style property
3.3.
Emphasis Mark Shorthand: the text-emphasis property
(2)
#valdef-text-emphasis-style-none
Referenced in:
3.1.
Emphasis Mark Style: the text-emphasis-style property
#valdef-text-emphasis-style-filled
Referenced in:
3.1.
Emphasis Mark Style: the text-emphasis-style property
(2)
(3)
#valdef-text-text-emphasis-open
Referenced in:
3.1.
Emphasis Mark Style: the text-emphasis-style property
(2)
#valdef-text-emphasis-style-circle
Referenced in:
3.1.
Emphasis Mark Style: the text-emphasis-style property
#valdef-text-emphasis-style-sesame
Referenced in:
3.1.
Emphasis Mark Style: the text-emphasis-style property
#propdef-text-emphasis-color
Referenced in:
3.
Emphasis Marks
3.2.
Emphasis Mark Color: the text-emphasis-color property
(2)
3.3.
Emphasis Mark Shorthand: the text-emphasis property
(2)
#propdef-text-emphasis
Referenced in:
3.
Emphasis Marks
3.3.
Emphasis Mark Shorthand: the text-emphasis property
5.1.
Painting Order of Text Decorations
Changes since the August 2013 Candidate Recommendation
#propdef-text-emphasis-position
Referenced in:
3.
Emphasis Marks
3.3.
Emphasis Mark Shorthand: the text-emphasis property
3.4.
Emphasis Mark Position: the text-emphasis-position property
(2)
Changes since the August 2013 Candidate Recommendation
(2)
#valdef-text-emphasis-position-right
Referenced in:
3.4.
Emphasis Mark Position: the text-emphasis-position property
Changes since the August 2013 Candidate Recommendation
#propdef-text-shadow
Referenced in:
2.
Line Decoration: Underline, Overline, and Strike-Through
4.
Text Shadows: the text-shadow property
5.1.
Painting Order of Text Decorations
Changes since the August 2019 Candidate Recommendation
Changes since the August 2013 Candidate Recommendation
(2)
(3)