使用prism.js突出显示html

Question

我似乎无法使用prism.js突出显示html,因为它删除了仅打印文本的标记."pre"标记内的以下代码仅显示为文本.我将"code"标记的类设置为"language-markup".

    <table class="data-table">
        <tr>
            <td>Title</td>
            <td>Amount</td>
        </tr>
        <tr>
            <td>Shorts</td>
            <td>£1.00</td>
        </tr>   
        <tr>
            <td>Shorts</td>
            <td>£1.00</td>
        </tr>           
    </table>

显示为

            Title
            Amount


            Shorts
            £1.00


            Shorts
            £1.00

Answer 1

您需要使用 来转义标签的开头<。最简单的方法是将您的 html 代码粘贴到 pre 标签中，然后对所有<字符执行查找和替换。

这应该有效：

<table class="data-table">
    <tr>
        <td>Title</td>
        <td>Amount</td>
    </tr>
    <tr>
        <td>Shorts</td>
        <td>£1.00</td>
    </tr>   
    <tr>
        <td>Shorts</td>
        <td>£1.00</td>
    </tr>           
</table>