The text-emphasis-style
CSS property defines the type of emphasis used. It can also be set, and reset, using the text-emphasis
shorthand.
/* Initial value */ text-emphasis-style: none; /* No emphasis marks */ /* value */ text-emphasis-style: 'x'; text-emphasis-style: '点'; text-emphasis-style: '\25B2'; text-emphasis-style: '*'; text-emphasis-style: 'foo'; /* Should NOT use. It may be computed to or rendered as 'f' only */ /* Keywords value */ text-emphasis-style: filled; text-emphasis-style: open; text-emphasis-style: filled sesame; text-emphasis-style: open sesame; /* Global values */ text-emphasis-style: inherit; text-emphasis-style: initial; text-emphasis-style: unset;
Initial value | none |
---|---|
Applies to | all elements |
Inherited | no |
Media | visual |
Computed value | as specified |
Animation type | discrete |
Canonical order | the unique non-ambiguous order defined by the formal grammar |
none
filled
filled
nor open
is present, this is the default.open
dot
'•'
(U+2022
), and the open dot is '◦'
(U+25E6
).circle
'●'
(U+25CF
), and the open circle is '○'
(U+25CB
).double-circle
'◉'
(U+25C9
), and the open double-circle is '◎'
(U+25CE
).triangle
'▲'
(U+25B2
), and the open triangle is '△'
(U+25B3
).sesame
'﹅'
(U+FE45
), and the open sesame is '﹆'
(U+FE46
).<string>
<string>
. The UA may truncate or ignore strings consisting of more than one grapheme cluster.none | [ [ filled | open ] || [ dot | circle | double-circle | triangle | sesame ] ] | <string>
h2 { text-emphasis-style: sesame; }
Specification | Status | Comment |
---|---|---|
CSS Text Decoration Module Level 3 The definition of 'text-emphasis' in that specification. | Candidate Recommendation | Initial definition |
Feature | Chrome | Edge | Firefox | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|---|
Basic support | 25 -webkit- | ? |
46 45 — 491 |
No | 15 -webkit- |
Yes 6.1 -webkit- |
Feature | Android webview | Chrome for Android | Edge mobile | Firefox for Android | IE mobile | Opera Android | iOS Safari |
---|---|---|---|---|---|---|---|
Basic support | 4.4 -webkit- | ? | ? |
46 45 — 491 |
No | 33 -webkit- | 7.1 |
1. From version 45 until version 49 (exclusive): this feature is behind the layout.css.text-emphasis.enabled
preference (needs to be set to true
). To change preferences in Firefox, visit about:config.
text-emphasis-color
, text-emphasis
.text-emphasis-position
property allowing to define the position of the emphasis marks.
© 2005–2018 Mozilla Developer Network and individual contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/CSS/text-emphasis-style