Handle HTML Inline Styles in Markdown Conversion

HTML Inline Styles to Markdown

Markdown does not support CSS styling, so inline style attributes are typically stripped during conversion. However, some styles can be approximated with Markdown syntax.

Styles That Map to Markdown

Certain CSS properties have Markdown equivalents:

<span style="font-weight: bold">Bold text</span>
<span style="font-style: italic">Italic text</span>
<span style="font-weight: bold; font-style: italic">Bold italic</span>

A smart converter maps these to:

**Bold text**
*Italic text*
***Bold italic***

Styles That Are Lost

Most CSS properties have no Markdown equivalent and are simply dropped:

<span style="color: red">Red text</span>
<span style="font-size: 24px">Large text</span>
<span style="text-decoration: underline">Underlined</span>
<span style="background-color: yellow">Highlighted</span>

All of these convert to plain text in Markdown:

Red text
Large text
Underlined
Highlighted

Strikethrough

The text-decoration: line-through style can be converted to GFM strikethrough syntax:

<span style="text-decoration: line-through">deprecated</span>

Converts to:

~~deprecated~~

This requires GitHub Flavored Markdown support.

Preserving Style Intent

When converting styled HTML, consider the intent behind the styling:

• Color-coded text (e.g., error messages in red) — add context words like "Error:" instead.
• Font size changes — convert to appropriate heading levels if used as section headers.
• Background highlights — wrap in bold or use a blockquote to draw attention.
• Alignment — Markdown does not support text alignment outside of tables.

The Practical Approach

For content that heavily relies on styling, some converters offer an option to output raw HTML where Markdown syntax is insufficient. This preserves the visual intent at the cost of Markdown purity.