CSS text-emphasis-style Property


Example

Use of the text-emphasis-style property:

p.ex1 {
  text-emphasis-style: filled;
}

p.ex2 {
  text-emphasis-style: open;
}

p.ex3 {
  text-emphasis-style: double-circle;
}

p.ex4 {
  text-emphasis-style: "#";
}
Try it Yourself »

Definition and Usage

The text-emphasis-style property sets the style of emphasis marks.

Tip: The size of the emphasis marks is about 50% of the size of the font.

Default value: none
Inherited: yes
Version: CSS3
JavaScript syntax: object.style.textEmphasisStyle="triangle"

Browser Support

The numbers in the table specify the first browser version that fully supports the property.

Property
text-emphasis-style 99.0 99.0 46.0 7.0 85.0


CSS Syntax

text-emphasis-style: none|filled|open|dot|circle|double-circle|triangle|sesame|string|color|initial|inherit;

Value Description
none No emphasis marks are applied Demo ❯
filled The emphasis marks are filled with a solid color Demo ❯
open The emphasis marks are hollow Demo ❯
dot The emphasis marks are small circles Demo ❯
circle The emphasis marks are circles Demo ❯
double-circle The emphasis marks are double circles Demo ❯
triangle The emphasis marks are triangles Demo ❯
sesame The emphasis marks are sesames Demo ❯
string The emphasis marks are the given string (one character) Demo ❯
initial Sets this property to its default value. Read about initial
inherit Inherits this property from its parent element. Read about inherit

Copyright 1999-2023 by Refsnes Data. All Rights Reserved.