diff --git a/site/content/docs/4.3/content/typography.md b/site/content/docs/4.3/content/typography.md index a3451324568e..80709f27669d 100644 --- a/site/content/docs/4.3/content/typography.md +++ b/site/content/docs/4.3/content/typography.md @@ -135,13 +135,25 @@ Styling for common inline HTML5 elements. {{< example >}}

You can use the mark tag to highlight text.

This line of text is meant to be treated as deleted text.

+

This line of text is meant to be treated as no longer accurate.

This line of text is meant to be treated as an addition to the document.

+

This line of text will render as underlined

This line of text is meant to be treated as fine print.

This line rendered as bold text.

This line rendered as italicized text.

{{< /example >}} -`.mark` and `.small` classes are also available to apply the same styles as `` and `` while avoiding any unwanted semantic implications that the tags would bring. +Beware that those tags should be use for semantic purpose: +`` represents text which is marked or highlighted for reference or notation purposes. +`` represents side-comments and small print, like copyright and legal text. +`` represents element that are no longer relevant or no longer accurate. +`` represents a span of inline text which should be rendered in a way that indicates that it has a non-textual annotation. + +If you want to style your text, you should use those css classes instead: +`.mark` will apply the same styles as ``. +`.small` will apply the same styles as ``. +`.text-decoration-underline` will apply the same styles as ``. +`.text-decoration-line-through` will apply the same styles as ``. While not shown above, feel free to use `` and `` in HTML5. `` is meant to highlight words or phrases without conveying additional importance while `` is mostly for voice, technical terms, etc.