Comment faire pour ajouter des numéros de ligne de toutes les lignes dans Google Embellir?

Question

Je suis l'aide d'embellir:

<pre class="prettyprint linenums">
  some code
</pre>

Il fonctionne, mais le numéro de la ligne afficher tous les 5 lignes et non pas pour chaque ligne. Je suis l'aide de ces fichiers

<link href="../src/prettify.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="../src/prettify.js"></script>

Fondamentalement, à la fin de cette page http://google-code-prettify.googlecode.com/svn/trunk/styles/index.html vous pouvez voir que je veux, mais j'ai regardé le code et je ne peux pas la comprendre.

Answer 1

Vous devez supprimer list-style-type:none de votre embellir.css

/* Specify class=linenums on a pre to get line numbering */
ol.linenums { margin-top: 0; margin-bottom: 0 } /* IE indents via margin-left */
li.L0,
li.L1,
li.L2,
li.L3,
li.L5,
li.L6,
li.L7,
li.L8 { list-style-type: none /* <<< remove this! */ }
/* Alternate shading for lines */
li.L1,
li.L3,
li.L5,
li.L7,
li.L9 { background: #eee }

Answer 2

Solution

Au lieu de modifier le CSS, vous pouvez simplement ajouter une ligne de CSS pour obtenir le comportement souhaité:

<style>

    .prettyprint ol.linenums > li { list-style-type: decimal; }

</style>  

Exemple

Un exemple complet pourrait avoir le code ci-dessous. Afficher les résultats via jsfiddle ou voir ci-dessous

<link rel="stylesheet" href="http://stackoverflow.com//cdnjs.cloudflare.com/ajax/libs/prettify/r298/prettify.min.css" />

    <style>
        .prettyprint ol.linenums > li { list-style-type: decimal; }
    </style>

<pre class="prettyprint linenums">
 foo
 bar
 bis
 sed
 awk
 cat
</pre>


<script src="//cdnjs.cloudflare.com/ajax/libs/prettify/r298/prettify.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/prettify/r298/run_prettify.js"></script>

Answer 3

J'aime avoir de l'alternance des couleurs d'arrière-plan, donc, a fait de cette façon:

li.L0,
li.L1,
li.L2,
li.L3,
li.L5,
li.L6,
li.L7,
li.L8  { background: #fff; }
/* Alternate shading for lines */
li.L1,
li.L3,
li.L5,
li.L7,
li.L9 { background: #eee }