The text-emphasis-style property applies emphasis marks to the element's text.

  • Initial valuenone
  • Applies toAll elements
  • InheritedYes
  • MediaVisual
  • Computed value'none', a pair of keywords representing the shape and fill, or a string
  • AnimatableNo
  • CSS VersionCSS3
  • JavaScript syntaxobject.style.textEmphasisStyle
Formal syntax: none | [ [ filled | open ] || [ dot | circle | double-circle | triangle | sesame ] ] | <string>

text-emphasis-style: filled;
text-emphasis-style: open;
text-emphasis-style: dot;
text-emphasis-style: circle;
text-emphasis-style: double-circle;
text-emphasis-style: triangle;
text-emphasis-style: sesame;
text-emphasis-style: <string>
text-emphasis-style: none;
  • noneNo emphasis marks.
  • filledThe shape is filled with solid color.
  • openThe shape is hollow.
  • dotDisplay small circles as marks. The filled dot is U+2022 '•', and the open dot is U+25E6 '◦'.
  • circleDisplay large circles as marks. The filled circle is U+25CF '●', and the open circle is U+25CB '○'.
  • double-circleDisplay double circles as marks. The filled double-circle is U+25C9 '◉', and the open double-circle is U+25CE '◎'.
  • triangleDisplay triangles as marks. The filled triangle is U+25B2 '▲', and the open triangle is U+25B3 '△'.
  • sesameDisplay sesames as marks. The filled sesame is U+FE45 '﹅', and the open sesame is U+FE46 '﹆'.
  • <string>Display the given string as marks. Authors should not specify more than one character in [string]. The UA may truncate or ignore strings consisting of more than one grapheme cluster.
.class {
  text-emphasis-style: filled triangle;
}
?Firefox?Explorer?Chrome?Safari?Opera


Last updated on 23rd March 2014 By Rene Spronk

View All CSS Properties

Errors? Please help to keep this list up to date, If you find any errors, please contact us, so that we can get them fixed.