Code blocks
The <code>
and <pre>
elements are for displaying
inline and multiline blocks of code.
We use the highlight.js library for the code formatting. This library lets you easily provide high-quality syntax highlighting without requiring a lot of effort on your part. It can work with pretty much any markup, doesn’t depend on any other frameworks, and has automatic language detection.
Inline code
The <code>
and <pre>
elements are
for displaying inline and multiline blocks of code.
The <code> and <pre> elements are for displaying inline and multiline blocks of code.
HTML code
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>HTML</title>
</head>
<body>
<p>Lorem ipsum dolor sit amet. </p>
</body>
</html>
Theming
highlight.js comes with a lot of different light and dark themes.
For example, if you want to use the Atom Dark theme you need to find the following
line in the document_head.hbs
file:
<link rel="stylesheet" href="//cdn.jsdelivr.net/gh/highlightjs/cdn-release@10.7.2/build/styles/github.min.css">
And replace the file name from github.min.css
to
atom-one-dark.min.css
:
<link rel="stylesheet" href="//cdn.jsdelivr.net/gh/highlightjs/cdn-release@10.7.2/build/styles/atom-one-dark.min.css">
You can find the file names of all highlight.js themes in its repository.