mirror of https://github.com/ColorlibHQ/gentelella
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
56 lines
1.8 KiB
56 lines
1.8 KiB
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<title>Making Quines Prettier</title>
|
|
<!-- The defer is not necessary for autoloading, but is necessary for the
|
|
script at the bottom to work as a Quine. -->
|
|
<script src="https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js?autoload=true&skin=sunburst&lang=css" defer="defer"></script>
|
|
<style>.operative { font-weight: bold; border:1px solid yellow }</style>
|
|
</head>
|
|
|
|
<body>
|
|
<h1>Making Quines Prettier</h1>
|
|
|
|
<p>
|
|
Below is the content of this page prettified. The <code><pre></code>
|
|
element is prettified because it has <code>class="prettyprint"</code> and
|
|
because the sourced script loads a JavaScript library that styles source
|
|
code.
|
|
</p>
|
|
|
|
<p>
|
|
The line numbers to the left appear because the preceding comment
|
|
<code><?prettify lang=html linenums=true?></code> turns on
|
|
line-numbering and the
|
|
<a href="http://google-code-prettify.googlecode.com/svn/trunk/styles/index.html">stylesheet</a>
|
|
(see <code>skin=sunburst</code> in the <code><script src></code>)
|
|
specifies that every fifth line should be numbered.
|
|
</p>
|
|
|
|
<!-- Language hints can be put in XML application directive style comments. -->
|
|
<?prettify lang=html linenums=true?>
|
|
<pre class="prettyprint" id="quine" style="border:4px solid #88c"></pre>
|
|
|
|
<script>//<![CDATA[
|
|
(function () {
|
|
function html(s) {
|
|
return s.replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>');
|
|
}
|
|
|
|
var quineHtml = html(
|
|
'<!DOCTYPE html>\n<html>\n'
|
|
+ document.documentElement.innerHTML
|
|
+ '\n<\/html>\n');
|
|
|
|
// Highlight the operative parts:
|
|
quineHtml = quineHtml.replace(
|
|
/<script src[\s\S]*?><\/script>|<!--\?[\s\S]*?-->|<pre\b[\s\S]*?<\/pre>/g,
|
|
'<span class="operative">$&</span>');
|
|
|
|
document.getElementById("quine").innerHTML = quineHtml;
|
|
})();
|
|
//]]>
|
|
</script></body>
|
|
</html>
|