mettant en évidence html avec prism.js

Question

Je ne peux pas sembler mettre en évidence html avec prism.js, car il supprime le balisage en imprimant simplement le texte. le code suivant à l'intérieur de la balise "pre" montre seulement le texte. J'ai la classe pour la balise "code" définie sur "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> 

montre que

  Title 
      Amount 


      Shorts 
      £1.00 


      Shorts 
      £1.00 

Answer 1

Vous devez échapper au début des balises avec <. Le plus simple est de coller votre code html dans la balise pre, puis de rechercher et de remplacer tous les caractères <.

Cela devrait fonctionner:

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

Answer 2

En alternative, vous pouvez envelopper votre code avec <script type="prism-html-markup"> your code </script>