Syntax highlighting in <pre class = "prettyprint-override"> tags
Are there libraries that allow me to display code in tags <pre>and highlight syntax according to language? I imagine something like this:
<pre class="python">
class MyClass:
"""A simple example class"""
i = 12345
def f(self):
return 'hello world'
</pre>
... where CSS for pre.pythonwill appropriately highlight Python code.
Is there something similar?
+5
4 answers
There SyntaxHighlighter :
<pre class="brush: python">
# python code here
</pre>
There is also highlight.js , which has the ability to automatically determine the syntax and highlight it accordingly; however, you will need to use tags <pre><code>to wrap your code.
+11
highlight.js. 112 .
:
// Highlight 22 popular code types. TODO: Inline for speed and security.
function loadjscssfile(filename, filetype){ // http://www.javascriptkit.com/javatutors/loadjavascriptcss.shtml
if(filetype=="js"){
var fileref=document.createElement('script')
fileref.setAttribute("type","text/javascript")
fileref.setAttribute("src", filename)
}
else if(filetype=="css"){
var fileref=document.createElement("link")
fileref.setAttribute("rel", "stylesheet")
fileref.setAttribute("type", "text/css")
fileref.setAttribute("href", filename)
}
if(typeof fileref!="undefined") document.getElementsByTagName("head")[0].appendChild(fileref)
}
loadjscssfile("//cdnjs.cloudflare.com/ajax/libs/highlight.js/8.4/styles/vs.min.css", "css")
loadjscssfile("//cdnjs.cloudflare.com/ajax/libs/highlight.js/8.4/highlight.min.js", "js")
setTimeout("var a = document.querySelectorAll('.code'); for(var i=0; i < a.length; ++i) hljs.highlightBlock(a[i])", 600)
+2
, , , , Pandoc-Markdown, Pandoc html.
pandoc-markdown :
~~~{.python}
class MyClass:
"""A simple example class"""
i = 12345
def f(self):
return 'hello world'
~~~
0