2025-10-22
num1 = 10
num2 = 14
num3 = 12
if (num1 >= num2) and (num1 >= num3):
largest = num1
elif (num2 >= num1) and (num2 >= num3):
largest = num2
else:
largest = num3
print("The largest number is", largest)
<!DOCTYPE html>
<html lang="en"
data-page="/"
data-inputpath="README.md">
<head>
<title>
Prism
</title>
<meta name="viewport" content="width=device-width" />
<meta charset="utf-8" />
<link rel="icon" href="/assets/logo.svg" />
<link rel="stylesheet" href="/assets/style.css" />
<link rel="stylesheet" href="https://dev.prismjs.com/themes/prism.css" />
<script>var _gaq = [["_setAccount", "UA-33746269-1"], ["_trackPageview"]];</script>
<script src="https://www.google-analytics.com/ga.js" async></script>
<script>
console.log("foo");
</script></head>
<body class="">
<header>
<div class="intro">
<h1><a href="/"><img src="/assets/logo.svg" alt="Prism" /> </a></h1>
<a class='download-button' href='/download'>Download</a>
<p>
Prism is a lightweight, extensible syntax highlighter, built with modern web standards in mind.
It’s used in millions of websites, including some of those you visit daily.
</p>
</div>
<div id="theme">
<p>Theme:</p>
<input type="radio" name="theme" id="theme-prism" value="prism" />
<label for="theme-prism">Default</label>
<input type="radio" name="theme" id="theme-prism-dark" value="prism-dark" />
<label for="theme-prism-dark">Dark</label>
<input type="radio" name="theme" id="theme-prism-funky" value="prism-funky" />
<label for="theme-prism-funky">Funky</label>
<input type="radio" name="theme" id="theme-prism-okaidia" value="prism-okaidia" />
<label for="theme-prism-okaidia">Okaidia</label>
<input type="radio" name="theme" id="theme-prism-twilight" value="prism-twilight" />
<label for="theme-prism-twilight">Twilight</label>
<input type="radio" name="theme" id="theme-prism-coy" value="prism-coy" />
<label for="theme-prism-coy">Coy</label>
<input type="radio" name="theme" id="theme-prism-solarizedlight" value="prism-solarizedlight" />
<label for="theme-prism-solarizedlight">Solarized Light</label>
<input type="radio" name="theme" id="theme-prism-tomorrow" value="prism-tomorrow" />
<label for="theme-prism-tomorrow">Tomorrow Night</label>
</div>
<ul id="features">
<li><strong>Dead simple</strong>
Include prism.css and prism.js, use proper HTML5 code tags (<code>code.language-xxxx</code>), done!</li>
<li><strong>Intuitive</strong>
Language classes are inherited so you can only define the language once for multiple code snippets.</li>
<li><strong>Light as a feather</strong>
The core is 2KB minified & gzipped. Languages add 0.3-0.5KB each, themes are around 1KB.</li>
<li><strong>Blazing fast</strong>
Supports parallelism with Web Workers, if available.</li>
<li><strong>Extensible</strong>
Define new languages or extend existing ones. Add new features thanks to Prism’s plugin architecture.</li>
<li><strong>Easy styling</strong>
All styling is done through CSS, with sensible class names like <code>.comment</code>, <code>.string</code>, <code>.property</code> etc.</li>
</ul>
</header>
<aside id="toc">
<h2>On this page</h2>
<nav class="toc" >
<ul><li><a href="#used-by">Used By</a></li><li><a href="#examples">Examples</a></li><li><a href="#full-list-of-features">Full list of features</a></li><li><a href="#limitations">Limitations</a></li><li><a href="#basic-usage">Basic usage</a><ul><li><a href="#language-inheritance">Language inheritance</a></li><li><a href="#manual-highlighting">Manual highlighting</a></li><li><a href="#basic-usage-cdn">Usage with CDNs</a></li><li><a href="#basic-usage-bundlers">Usage with Webpack, Browserify, & Other Bundlers</a></li><li><a href="#basic-usage-node">Usage with Node</a></li></ul></li><li><a href="#supported-languages">Supported languages</a></li><li><a href="#plugins">Plugins</a></li><li><a href="#third-party-language-definitions">Third-party language definitions</a></li><li><a href="#third-party-tutorials">Third-party tutorials</a></li><li><a href="#credits">Credits</a></li></ul>
</nav>
</aside>
<main>
<section>
<h1 id="used-by" tabindex="-1"><a class="header-anchor" href="#used-by">Used By</a></h1>
<p>Prism is used on several websites, small and large. Some of them are:</p>
<div class="used-by-logos">
<a href="https://www.smashingmagazine.com/" target="_blank"><img src="assets/img/logo-smashing.png" alt="Smashing Magazine" /></a>
<a href="https://alistapart.com/" target="_blank"><img src="assets/img/logo-ala.png" alt="A List Apart" /></a>
<a href="https://developer.mozilla.org/" target="_blank"><img src="assets/img/logo-mdn.png" alt="Mozilla Developer Network (MDN)" /></a>
<a href="https://css-tricks.com/" target="_blank"><img src="assets/img/logo-css-tricks.png" alt="CSS-Tricks" /></a>
<a href="https://www.sitepoint.com/" target="_blank"><img src="assets/img/logo-sitepoint.png" alt="SitePoint" /></a>
<a href="https://www.drupal.org/" target="_blank"><img src="assets/img/logo-drupal.png" alt="Drupal" /></a>
<a href="https://reactjs.org/" target="_blank"><img src="assets/img/logo-react.png" alt="React" /></a>
<a href="https://stripe.com/" target="_blank"><img src="assets/img/logo-stripe.png" alt="Stripe" /></a>
<a href="https://dev.mysql.com/" target="_blank"><img src="assets/img/logo-mysql.png" alt="MySQL" /></a>
</div>
</section>
<section>
<h1 id="examples" tabindex="-1"><a class="header-anchor" href="#examples">Examples</a></h1>
<p>The Prism source, highlighted with Prism (don’t you just love how meta this is?):</p>
<pre data-src="https://dev.prismjs.com/prism.js"></pre>
<p>This page’s CSS code, highlighted with Prism:</p>
<pre data-src="assets/style.css"></pre>
<p>This page’s HTML, highlighted with Prism:</p>
<pre data-src="index.html"></pre>
<p>This page’s logo (SVG), highlighted with Prism:</p>
<pre data-src="assets/logo.svg"></pre>
<p>If you’re still not sold, you can <a href='/examples'>view more examples</a> or <a href='/test'>try it out for yourself</a>.</p>
</section>
<section class="language-markup">
<h1 id="full-list-of-features" tabindex="-1"><a class="header-anchor" href="#full-list-of-features">Full list of features</a></h1>
<ul>
<li><strong>Only 2KB</strong> minified & gzipped (core). Each language definition adds roughly 300-500 bytes.</li>
<li>Encourages good author practices. Other highlighters encourage or even force you to use elements that are semantically wrong, like <code><pre></code> (on its own) or <code><script></code>. Prism forces you to use the correct element for marking up code: <code><code></code>. On its own for inline code, or inside a <code><pre></code> for blocks of code. In addition, the language is defined through the way recommended in the HTML5 draft: through a <code>language-xxxx</code> class.</li>
<li>The <code>language-xxxx</code> class is inherited. This means that if multiple code snippets have the same language, you can just define it once, in one of their common ancestors.</li>
<li>Supports <strong>parallelism with Web Workers</strong>, if available. Disabled by default (<a href='/faq#why-is-asynchronous-highlighting-disabled-by-default'>why?</a>).</li>
<li>Very easy to extend without modifying the code, due to Prism’s <a href="#plugins">plugin architecture</a>. Multiple hooks are scattered throughout the source.</li>
<li>Very easy to <a href='/extending#language-definitions'>define new languages</a>. The only thing you need is a good understanding of regular expressions.</li>
<li>All styling is done through CSS, with <a href='/faq#how-do-i-know-which-tokens-i-can-style-for'>sensible class names</a> rather than ugly, namespaced, abbreviated nonsense.</li>
<li>Wide browser support: Edge, IE11, Firefox, Chrome, Safari, <a href='/faq#this-page-doesnt-work-in-opera'>Opera</a>, most mobile browsers.</li>
<li>Highlights embedded languages (e.g. CSS inside HTML, JavaScript inside HTML).</li>
<li>Highlights inline code as well, not just code blocks.</li>
<li>It doesn’t force you to use any Prism-specific markup, not even a Prism-specific class name, only standard markup you should be using anyway. So, you can just try it for a while, remove it if you don’t like it and leave no traces behind.</li>
<li>Highlight specific lines and/or line ranges (requires <a href="plugins/line-highlight/">plugin</a>).</li>
<li>Show invisible characters like tabs, line breaks etc (requires <a href="plugins/show-invisibles/">plugin</a>).</li>
<li>Autolink URLs and emails, use Markdown links in comments (requires <a href="plugins/autolinker/">plugin</a>).</li>
</ul>
</section>
<section>
<h1 id="limitations" tabindex="-1"><a class="header-anchor" href="#limitations">Limitations</a></h1>
<ul>
<li>Any pre-existing HTML in the code will be stripped off. <a href='/faq#if-pre-existing-html-is-stripped-off-how-can-i-highlight'>There are ways around it though</a>.</li>
<li>Regex-based so it *will* fail on certain edge cases, which are documented in the <a href='/known-failures'>known failures page</a>.</li>
<li>Some of our themes have problems with certain layouts. Known cases are documented <a href='/known-failures#themes'>here</a>.</li>
<li>No IE 6-10 support. If someone can read code, they are probably in the 95% of the population with a modern browser.</li>
</ul>
</section>
<section class="language-markup">
<h1 id="basic-usage" tabindex="-1"><a class="header-anchor" href="#basic-usage">Basic usage</a></h1>
<p>Y
:root {
--background: #ffffff;
--foreground: #000000;
--accent: #ff0000;
--midtone: #ddd;
}
.darkmode{
--background: #000;
--foreground: #fff;
--accent: #ff0000;
--midtone: #444;
}
::selection {
color:var(--background);
background:var(--accent);
}
::-moz-selection {
color:var(--background);
background:var(--accent);
}
a.header:link {
text-decoration:none;
}
a:link {
color:var(--foreground);
text-decoration:underline;
text-decoration-color:var(--accent);
text-underline-offset:20%;
text-decoration-thickness:2px;
box-shadow: 0.1em 0.1em var(--accent);
}
a:visited {
color:var(--foreground);
text-decoration-color:var(--foreground);
}
a:hover {
color:var(--accent);
text-decoration: none;
box-shadow: 0.2em 0.2em var(--foreground);
}
nav {
text-decoration:none;
font-family:atari, serif;
margin:0.5em
}
body {
margin:0;
color:var(--foreground);
background-color:var(--background);
}
button {
border-color:var(--foreground);
background-color:var(--background);
color:var(--foreground);
box-shadow: 0em 0.2em var(--foreground);
cursor: pointer;
text-align:center;
margin:0.5em
}
button:hover {
border-color:var(--background);
background-color:var(--foreground);
color:var(--background);
box-shadow: 0em 0.2em var(--background),
0em 0.4em var(--foreground);
;
}
code {
background-color:var(--midtone);
}
code::before { content:"`"; }
code::after { content:"`"; }
pre code {
font-weight:bold;
background-color:var(--background);
}
hr {
border-color:var(--foreground);
}
h1 { margin:0; }
h1, h2, h3, h4, h5 {
font-family:atari, serif;
color:var(--background);
background-color:var(--foreground);
}
h6 {
font-family:atari, serif;
color:var(--background);
background-color:var(--accent);
}
p {
max-width:640px;
font-family:jetbrains, sans-serif;
margin:1em;
}
@font-face {
font-family: atari;
src: url('AtariST8x16SystemFont.woff2') format('woff2');
font-display: swap;
}
@font-face {
font-family: jetbrains;
src: url('JetBrainsMono-Regular.woff2') format('woff2');
font-display: swap;
}
blockquote {
max-width:560px;
margin: 2em;
border:4px dashed;
padding: 0.5em;
font-style:italic;
}
pre {
max-width:80vw;
max-height:80vh;
margin: 2em;
border:8px double;
padding: 1em;
font-size: 1em;
font-family: Consolas, monospace;
overflow: auto;
code::before { content:""; }
code::after { content:""; }
}
h1 {
font-style:italic;
font-size:2.5em;
padding:0.5em;
}
h2 {
font-size:2.5em;
padding:0.25em;
padding-left:4%;
padding-right:4%;
}
h3 {
font-size:2em;
padding:0.25em;
padding-left:8%;
padding-right:8%;
}
h4 {
font-size:1.5em;
padding:0.25em;
padding-left:12%;
padding-right:12%;
}
h5 {
font-size:1em;
padding:0.25em;
padding-left:16%;
padding-right:16%;
}
h6 {
font-size:1em;
padding:0.25em;
padding-left:20%;
padding-right:20%;
}
img {
max-width:80vw; height:auto;
border: 0.5em solid var(--foreground);
border-right: 2em solid var(--foreground);
border-bottom: 2em solid var(--foreground);
margin:1em;
}
iframe {
width:80vw; height:60vh;
border: 0.5em solid var(--accent);
border-right: 2em solid var(--accent);
border-bottom: 2em solid var(--accent);
margin:1em;
}
video {
width:80vw; height:60vh;
border: 0.5em solid var(--accent);
border-right: 2em solid var(--accent);
border-bottom: 2em solid var(--accent);
margin:1em;
}
figure {
inline-size: fit-content;
margin:0;
}
figcaption {
width:80%;
padding:1%;
padding-left:2%;
contain: inline-size;
position: relative;
left: 1em;
bottom: 2em;
font-family:atari, serif;
color:var(--background);
background-color:var(--foreground);
}