Github markdown - cannot change any style by inline-css and class

问题

I try to change font size and line height but failed. I've tried inline style:

<div style="font-size: 12px; line-height: 12px;")>bla</div>

and class:

<style>
.footnote {font-size: 12px !important; line-height: 12px !important;}
</style>

<div class="footnote">bla</div>

and markdown syntax:

<font size=1>bla</font>

None of them work. In Concole the DOM is just like:

<div>bla</div>

and styles are always defined by default markdown:

.markdown-body {
    font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji;
    font-size: 16px;
    line-height: 1.5;
}

Seems my setting takes no effect and even class is not added.

I also tried some other tags like <p> <span> but not working.

P.S. In VS Code Github Markdown preview it shows properly.

回答1:

This is not possible due to security concerns.

In fact, it is not related to Markdown, but rather GitHub's post-processing of all user provided markup, as documented in github/markup. The conversion of Markdown to HTML happens in step 1, which leaves your tags and attributes intact. However, of note is step 2:

The HTML is sanitized, aggressively removing things that could harm you and your kin—such as script tags, inline-styles, and class or id attributes.

A previous version of that document linked to the code for the HTML sanitizer they were using at the time. Whether they are still using that sanitizer or a different one is currently unknown. However, a review of the code for that sanitizer makes it clear that they are striping out all user defined styles. If they have updated to a new sanitizer, it is likely that it has been made more strict.

In conclusion, it is clear that GitHub does not allow any user-defined styles to be used on their site.

来源：https://stackoverflow.com/questions/60331472/github-markdown-cannot-change-any-style-by-inline-css-and-class

标签

Markdown

github-flavored-markdown