使用prism.js突出显示html [英] highlighting html with prism.js

问题描述

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

I cant seem to highlight html with prism.js because it removes the markup just printing the text. the following code inside the "pre" tag shows as just the text. I have the class for the "code" tag set to "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

推荐答案

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

You need to escape the beginning of the tags with <. The easiest way is to paste your html code into the pre tag, then perform a find and replace for all < characters.

这应该有效：

<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>

这篇关于使用prism.js突出显示html的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！