\\\\n

Example

\\\\n

Add emphasis marks to text:

\\\\n

p {\\\\n  text-emphasis: filled red;\\\\n}\\\\n

\\\\n

Try it »

\\\\n

---

\\\\n

Browser Support

\\\\n

The numbers in the table indicate the first browser version that supports this property.

\\\\n \\\\n \\\\n \\\\n \\\\n \\\\n \\\\n \\\\n \\\\n \\\\n \\\\n \\\\n \\\\n \\\\n \\\\n \\\\n \\\\n \\\\n \\\\n \\\\n

property
text-emphasis	6.0	Not supported	46.0	Not supported	7.0

\\\\n

---

\\\\n

Definition and Usage

\\\\n

text-emphasis propertyIs the shorthand property for the following properties:

\\\\n

\\\\n
• text-emphasis-style
\\\\n
• text-emphasis-color
\\\\n

\\\\n

text-emphasis propertyApplies special emphasis marks to the element's text to draw attention. The shape of the marks can be a circle, dot, double circle, or a specific character (e.g., an exclamation mark).

\\\\n

Note: text-emphasis propertyAffects the layout of text but does not affect line height. Therefore, emphasis marks may overlap with lines above or below.

\\\\n

---

\\\\n

CSS Syntax

\\\\n

text-emphasis: text-emphasis-style text-emphasis-color|initial|inherit;\\\\n

\\\\n

propertyValue

\\\\n \\\\n \\\\n \\\\n \\\\n \\\\n \\\\n \\\\n \\\\n \\\\n \\\\n \\\\n \\\\n \\\\n \\\\n \\\\n \\\\n \\\\n \\\\n \\\\n \\\\n \\\\n \\\\n \\\\n

Value	Description
text-emphasis-style	Specify the shape of emphasis marks. Possible values:none、filled、open、dot、circle、double-circle、triangle、sesame or string。
text-emphasis-color	Specifies the color of the emphasis marks.
initial	Set this property to its default value.
inherit	Inherit this property from its parent element.

\\\\n

---

\\\\n

More Examples

\\\\n

Example 1

\\\\n

Use different emphasis styles:

\\\\n

p.a {\\\\n  text-emphasis: filled red;\\\\n}\\\\np.b {\\\\n  text-emphasis: open red;\\\\n}\\\\np.c {\\\\n  text-emphasis: dot red;\\\\n}\\\\np.d {\\\\n  text-emphasis: circle red;\\\\n}\\\\np.e {\\\\n  text-emphasis: double-circle red;\\\\n}\\\\np.f {\\\\n  text-emphasis: triangle red;\\\\n}\\\\np.g {\\\\n  text-emphasis: sesame red;\\\\n}\\\\np.h {\\\\n  text-emphasis: filled "★" red;\\\\n}\\\\n

\\\\n

Try it »

\\\\n

Example 2

\\\\n

Use the shorthand property to set the position of emphasis marks:

\\\\n

p {\\\\n  text-emphasis: filled red;\\\\n  text-emphasis-position: over right;\\\\n}\\\\n

\\\\n

Try it »

\\\\n

---

\\\\n

\\\\n

\\\\n
• CSS3 Text effects
\\\\n

\\\\n