Как отобразить HTML-контент в github README.md?

83

Я новичок в github, README.mdхочу отображать HTML-контент с помощью iframe или что-то такое возможно?

Я пробовал просто создавать HTML-теги, кроме привязки, которые не работают.

github markdown БалаКришнан 웃
источник
Другие предложения в повторяющемся вопросе: stackoverflow.com/questions/48402823/…
ms609

Ответы:

47

Интерпретатор уценки Github может включать HTML. Однако в HTML вы можете сделать очень мало. Я бы посоветовал ознакомиться с этой статьей, в которой содержится дополнительная информация о том, какие теги можно использовать. Лично я никогда не использовал ничего, кроме разрывов строк, горизонтальных правил и т. Д. К сожалению, я не вижу упомянутых в статье фреймов iframe.

mjgpy3
источник
14
Они агрессивно удаляют html, который может нанести вред пользователям, например скрипты. Iframe попадает в эту категорию, потому что вы потенциально можете обслуживать людей что угодно, даже вредоносное ПО прямо здесь, на github.
s1h4d0w
39

Как ответил mjgpy3 , вы можете включить html - <html>теги не нужны, но он будет очищен перед отображением, и единственные разрешенные теги находятся в этом белом списке .

Список на данный момент включает:

h1 h2 h3 h4 h5 h6 h7 h8 br b i strong em a pre code img tt div ins del sup sub p ol ul table thead tbody tfoot blockquote dl dt dd kbd q samp var hr ruby rt rp li tr td th s strike summary details caption figure figcaption abbr bdo cite dfn mark small span time wbr

но нет iframe.

lazysoundystem
источник
1
Опубликованный список lazysoundsystem изменен, РАЗРЕШЕННЫЕ HTML-теги см. в строке # 46,47,48: GitHub-HTML-pipeline-sanitization_filter.rb , я проверил + на данный момент обнаружил, что ссылка верна. Такие теги запрещены: script, style, iframe, span,… Но div, table,… частично разрешены. GitHub также удаляет / фильтрует многие атрибуты, используемые внутри тегов. Поскольку GitHub может применять фильтр к тегам и атрибутам, они должны разрешать <style>, <script>,… с Filtering-ON, чтобы разрешить хотя бы некоторые безопасные свойства / команды CSS + JS.
atErik
1

Вы можете использовать svg для обхода, пример кода (./path/example.svg):

<svg width="100" height="100" xmlns="http://www.w3.org/2000/svg">
<foreignObject width="100" height="100">
    <div xmlns="http://www.w3.org/1999/xhtml">
        <ul>
            <li>text</li>
        </ul>
        <!-- Other embed HTML element/text into SVG -->
    </div>
</foreignObject>
</svg>

а затем используйте способ вставки изображения, чтобы встроить файл svg в любой другой файл уценки, например:

![](./path/example.svg)
yihao ye
источник