Codeblock | PatternFly Elements

This example shows the supported languages for the base prism.js.

HTML Markup


<h1>example html</h1>
<p>some paragraph text</p>

Javascript Markup


const example="javascript";
let test=null;

CSS Markup


p { color: red; }
body { background-color: #eee; }

XML Markup


<breakfast_menu>
  <food>
    <name>Belgian Waffles</name>
    <price>$5.95</price>
    <description>Two of our famous Belgian Waffles with plenty of real maple syrup</description>
    <calories>650</calories>
  </food>
</breakfast_menu>

SVG Markup


<svg height="100" width="100">
  <circle cx="50" cy="50" r="40" stroke="black" stroke-width="3" fill="red" />
  Sorry, your browser does not support inline SVG.
</svg>

MathML Markup


<math xmlns="http://www.w3.org/1998/Math/MathML">
  <matrix>
    <matrixrow>
    <cn> 0 </cn> <cn> 1 </cn> <cn> 0 </cn>
    </matrixrow>
    <matrixrow>
    <cn> 0 </cn> <cn> 0 </cn> <cn> 1 </cn>
    </matrixrow>
    <matrixrow>
    <cn> 1 </cn> <cn> 0 </cn> <cn> 0 </cn>
    </matrixrow>
  </matrix>
</math>

C-Like Markup


#include <stdio.h>
int main() {
  // printf() displays the string inside quotation
  printf("Hello, World!");
  return 0;
}

This example shows the supported languages for the base prism.js.

HTML Markup


<h1>example html</h1>
<p>some paragraph text</p>

Javascript Markup


const example="javascript"
let test=null;

CSS Markup

Also showing use of "code-line-number-start" to set the starting line number if not set defaults to 1


p { color: red; }

body { background-color: #eee; }

XML Markup


<breakfast_menu>
  <food>
    <name>Belgian Waffles</name>
    <price>$5.95</price>
    <description>Two of our famous Belgian Waffles with plenty of real maple syrup</description>
    <calories>650</calories>
  </food>
</breakfast_menu>

SVG Markup


<svg height="100" width="100">
  <circle cx="50" cy="50" r="40" stroke="black" stroke-width="3" fill="red" />
  Sorry, your browser does not support inline SVG.
</svg>

MathML Markup


<math xmlns="http://www.w3.org/1998/Math/MathML">
  <matrix>
    <matrixrow>
      <cn> 0 </cn> <cn> 1 </cn> <cn> 0 </cn>
    </matrixrow>
    <matrixrow>
      <cn> 0 </cn> <cn> 0 </cn> <cn> 1 </cn>
    </matrixrow>
    <matrixrow>
      <cn> 1 </cn> <cn> 0 </cn> <cn> 0 </cn>
    </matrixrow>
  </matrix>
</math>

C-Like Markup


#include <stdio.h>
  int main() {
      // printf() displays the string inside quotation
      printf("Hello, World!");
      return 0;
  }

This example shows the supported languages for the base prism.js.

HTML Markup (Dark)


<h1>example html</h1>
<p>some paragraph text</p>

Javascript Markup (Dark)


const example="javascript"
let test=null;

CSS Markup (Dark)


p { color: red; }
body { background-color: #eee; }

XML Markup (Dark)


<breakfast_menu>
  <food>
    <name>Belgian Waffles</name>
    <price>$5.95</price>
    <description>Two of our famous Belgian Waffles with plenty of real maple syrup</description>
    <calories>650</calories>
  </food>
</breakfast_menu>

SVG Markup (Dark)


<svg height="100" width="100">
  <circle cx="50" cy="50" r="40" stroke="black" stroke-width="3" fill="red" />
  Sorry, your browser does not support inline SVG.
</svg>

MathML Markup (Dark)


<math xmlns="http://www.w3.org/1998/Math/MathML">
  <matrix>
    <matrixrow>
      <cn> 0 </cn> <cn> 1 </cn> <cn> 0 </cn>
    </matrixrow>
    <matrixrow>
      <cn> 0 </cn> <cn> 0 </cn> <cn> 1 </cn>
    </matrixrow>
    <matrixrow>
      <cn> 1 </cn> <cn> 0 </cn> <cn> 0 </cn>
    </matrixrow>
  </matrix>
</math>

C-Like Markup (Dark)


#include <stdio.h>
  int main() {
      // printf() displays the string inside quotation
      printf("Hello, World!");
      return 0;
  }

This example shows the supported languages for the base prism.js.

HTML Markup


<h1>example html</h1>
<p>some paragraph text</p>

Javascript Markup


const example="javascript"
let test=null;

CSS Markup

Also showing use of "code-line-number-start" to set the starting line number if not set defaults to 1


p { color: red; }

body { background-color: #eee; }

XML Markup


<breakfast_menu>
  <food>
    <name>Belgian Waffles</name>
    <price>$5.95</price>
    <description>Two of our famous Belgian Waffles with plenty of real maple syrup</description>
    <calories>650</calories>
  </food>
</breakfast_menu>

SVG Markup


<svg height="100" width="100">
  <circle cx="50" cy="50" r="40" stroke="black" stroke-width="3" fill="red" />
  Sorry, your browser does not support inline SVG.
</svg>

MathML Markup


<math xmlns="http://www.w3.org/1998/Math/MathML">
  <matrix>
    <matrixrow>
      <cn> 0 </cn> <cn> 1 </cn> <cn> 0 </cn>
    </matrixrow>
    <matrixrow>
      <cn> 0 </cn> <cn> 0 </cn> <cn> 1 </cn>
    </matrixrow>
    <matrixrow>
      <cn> 1 </cn> <cn> 0 </cn> <cn> 0 </cn>
    </matrixrow>
  </matrix>
</math>

C-Like Markup


#include <stdio.h>
  int main() {
      // printf() displays the string inside quotation
      printf("Hello, World!");
      return 0;
  }