index page
welle7
parent
8314add14d
commit
2572abee26
|
|
@ -25,4 +25,5 @@
|
|||
|
||||
### Interne Links
|
||||
* [Semantische Tags](html/semantik.html)
|
||||
* [Seitenstruktur](html/struktur.html)
|
||||
* [Seitenstruktur](html/struktur.html)
|
||||
* [Kopfbereich](html/header.html)
|
||||
124
css/code.css
124
css/code.css
|
|
@ -1,16 +1,38 @@
|
|||
/* PrismJS 1.19.0
|
||||
https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */
|
||||
/**
|
||||
* prism.js default theme for JavaScript, CSS and HTML
|
||||
* Based on dabblet (http://dabblet.com)
|
||||
* @author Lea Verou
|
||||
*/
|
||||
https://prismjs.com/download.html#themes=prism-solarizedlight&languages=markup+css+clike+javascript */
|
||||
/*
|
||||
Solarized Color Schemes originally by Ethan Schoonover
|
||||
http://ethanschoonover.com/solarized
|
||||
|
||||
Ported for PrismJS by Hector Matos
|
||||
Website: https://krakendev.io
|
||||
Twitter Handle: https://twitter.com/allonsykraken)
|
||||
*/
|
||||
|
||||
/*
|
||||
SOLARIZED HEX
|
||||
--------- -------
|
||||
base03 #002b36
|
||||
base02 #073642
|
||||
base01 #586e75
|
||||
base00 #657b83
|
||||
base0 #839496
|
||||
base1 #93a1a1
|
||||
base2 #eee8d5
|
||||
base3 #fdf6e3
|
||||
yellow #b58900
|
||||
orange #cb4b16
|
||||
red #dc322f
|
||||
magenta #d33682
|
||||
violet #6c71c4
|
||||
blue #268bd2
|
||||
cyan #2aa198
|
||||
green #859900
|
||||
*/
|
||||
|
||||
code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
color: black;
|
||||
background: none;
|
||||
text-shadow: 0 1px white;
|
||||
color: #657b83; /* base00 */
|
||||
font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
|
||||
font-size: 1em;
|
||||
text-align: left;
|
||||
|
|
@ -18,6 +40,7 @@ pre[class*="language-"] {
|
|||
word-spacing: normal;
|
||||
word-break: normal;
|
||||
word-wrap: normal;
|
||||
|
||||
line-height: 1.5;
|
||||
|
||||
-moz-tab-size: 4;
|
||||
|
|
@ -32,21 +55,12 @@ pre[class*="language-"] {
|
|||
|
||||
pre[class*="language-"]::-moz-selection, pre[class*="language-"] ::-moz-selection,
|
||||
code[class*="language-"]::-moz-selection, code[class*="language-"] ::-moz-selection {
|
||||
text-shadow: none;
|
||||
background: #b3d4fc;
|
||||
background: #073642; /* base02 */
|
||||
}
|
||||
|
||||
pre[class*="language-"]::selection, pre[class*="language-"] ::selection,
|
||||
code[class*="language-"]::selection, code[class*="language-"] ::selection {
|
||||
text-shadow: none;
|
||||
background: #b3d4fc;
|
||||
}
|
||||
|
||||
@media print {
|
||||
code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
text-shadow: none;
|
||||
}
|
||||
background: #073642; /* base02 */
|
||||
}
|
||||
|
||||
/* Code blocks */
|
||||
|
|
@ -54,29 +68,29 @@ pre[class*="language-"] {
|
|||
padding: 1em;
|
||||
margin: .5em 0;
|
||||
overflow: auto;
|
||||
border-radius: 0.3em;
|
||||
}
|
||||
|
||||
:not(pre) > code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
background: #f5f2f0;
|
||||
background-color: #fdf6e3; /* base3 */
|
||||
}
|
||||
|
||||
/* Inline code */
|
||||
:not(pre) > code[class*="language-"] {
|
||||
padding: .1em;
|
||||
border-radius: .3em;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
.token.comment,
|
||||
.token.prolog,
|
||||
.token.doctype,
|
||||
.token.cdata {
|
||||
color: slategray;
|
||||
color: #93a1a1; /* base1 */
|
||||
}
|
||||
|
||||
.token.punctuation {
|
||||
color: #999;
|
||||
color: #586e75; /* base01 */
|
||||
}
|
||||
|
||||
.token.namespace {
|
||||
|
|
@ -90,7 +104,7 @@ pre[class*="language-"] {
|
|||
.token.constant,
|
||||
.token.symbol,
|
||||
.token.deleted {
|
||||
color: #905;
|
||||
color: #268bd2; /* blue */
|
||||
}
|
||||
|
||||
.token.selector,
|
||||
|
|
@ -98,34 +112,31 @@ pre[class*="language-"] {
|
|||
.token.string,
|
||||
.token.char,
|
||||
.token.builtin,
|
||||
.token.url,
|
||||
.token.inserted {
|
||||
color: #690;
|
||||
color: #2aa198; /* cyan */
|
||||
}
|
||||
|
||||
.token.operator,
|
||||
.token.entity,
|
||||
.token.url,
|
||||
.language-css .token.string,
|
||||
.style .token.string {
|
||||
color: #9a6e3a;
|
||||
background: hsla(0, 0%, 100%, .5);
|
||||
.token.entity {
|
||||
color: #657b83; /* base00 */
|
||||
background: #eee8d5; /* base2 */
|
||||
}
|
||||
|
||||
.token.atrule,
|
||||
.token.attr-value,
|
||||
.token.keyword {
|
||||
color: #07a;
|
||||
color: #859900; /* green */
|
||||
}
|
||||
|
||||
.token.function,
|
||||
.token.class-name {
|
||||
color: #DD4A68;
|
||||
color: #b58900; /* yellow */
|
||||
}
|
||||
|
||||
.token.regex,
|
||||
.token.important,
|
||||
.token.variable {
|
||||
color: #e90;
|
||||
color: #cb4b16; /* orange */
|
||||
}
|
||||
|
||||
.token.important,
|
||||
|
|
@ -140,3 +151,44 @@ pre[class*="language-"] {
|
|||
cursor: help;
|
||||
}
|
||||
|
||||
pre[class*="language-"].line-numbers {
|
||||
position: relative;
|
||||
padding-left: 3.8em;
|
||||
counter-reset: linenumber;
|
||||
}
|
||||
|
||||
pre[class*="language-"].line-numbers > code {
|
||||
position: relative;
|
||||
white-space: inherit;
|
||||
}
|
||||
|
||||
.line-numbers .line-numbers-rows {
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
top: 0;
|
||||
font-size: 100%;
|
||||
left: -3.8em;
|
||||
width: 3em; /* works for line-numbers below 1000 lines */
|
||||
letter-spacing: -1px;
|
||||
border-right: 1px solid #999;
|
||||
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
|
||||
}
|
||||
|
||||
.line-numbers-rows > span {
|
||||
pointer-events: none;
|
||||
display: block;
|
||||
counter-increment: linenumber;
|
||||
}
|
||||
|
||||
.line-numbers-rows > span:before {
|
||||
content: counter(linenumber);
|
||||
color: #999;
|
||||
display: block;
|
||||
padding-right: 0.8em;
|
||||
text-align: right;
|
||||
}
|
||||
|
|
@ -1,7 +1,10 @@
|
|||
body {
|
||||
font: 1.2em helvetica, sans-serif;
|
||||
font: normal 500 1.2em helvetica, sans-serif;
|
||||
height: 100%;
|
||||
}
|
||||
h1, h2{
|
||||
font-weight: 100;
|
||||
}
|
||||
main{
|
||||
max-width: 960px;
|
||||
margin: 20px auto;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,60 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="Die HTML -HEADER Struktur in Webseiten">
|
||||
<title>Der HEADER in der HTML Struktur</title>
|
||||
<link rel="stylesheet" href="../css/code.css">
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<header>
|
||||
<img src="../img/logo.svg" alt="Mein logo" title="Der Titel meines Bildes">
|
||||
</header>
|
||||
|
||||
<main role="main">
|
||||
<h1>Der HEADER in der HTML Struktur</h1>
|
||||
<article>
|
||||
<h2>Was gehört in den Kopf der HTML-Datei?</h2>
|
||||
<ul>
|
||||
<li>Benutzte Sprache </li>
|
||||
<li>Metainfoirmationen</li>
|
||||
<li>Title</li>
|
||||
<li>CSS</li>
|
||||
<li>Favicon</li>
|
||||
</ul>
|
||||
|
||||
<pre class="line-numbers language-html">
|
||||
<code class="language-html"><head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="Die HTML - HEADER Struktur in Webseiten">
|
||||
<meta name="robots" content="index,follow">
|
||||
<meta name="author" content="Mein Name">
|
||||
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<title>Der HEADER in der HTML Struktur</title>
|
||||
</head>
|
||||
</code>
|
||||
</pre>
|
||||
</article>
|
||||
|
||||
<aside>
|
||||
<h2>Artikel 2</h2>
|
||||
<p>Diese Seite enthält zunächst die Struktur und wenig Inhalt.<br>
|
||||
Das <strong>Bild</strong> erhält ein <strong>title</strong> und ein <strong>alt Attribut</strong>. Die
|
||||
<strong>Links</strong> erhalten ein <strong>title Attribut</strong>.
|
||||
</p>
|
||||
</aside>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
<a href="https://git.perin.work/andy/webdev">Download</a>
|
||||
</footer>
|
||||
<script src="../js/code.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
|
@ -2,51 +2,51 @@
|
|||
<html lang="de">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>HTML Semantic Tags</title>
|
||||
<link rel="stylesheet" href="../css/code.css">
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>HTML Semantic Tags</title>
|
||||
<link rel="stylesheet" href="../css/code.css">
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<main>
|
||||
<header>
|
||||
<h1>HTML Semantische Tags</h1>
|
||||
</header>
|
||||
<pre class=" language-html">
|
||||
<code class=" language-html">
|
||||
<abbr> Abbreviation
|
||||
<acronym> Acronym
|
||||
<blockquote> Long quotation
|
||||
<dfn> Definition
|
||||
<address> Address for author(s) of the document
|
||||
<cite> Citation
|
||||
<code> Code reference
|
||||
<tt> Teletype text
|
||||
<div> Logical division
|
||||
<span> Generic inline style container
|
||||
<del> Deleted text
|
||||
<ins> Inserted text
|
||||
<em> Emphasis
|
||||
<strong> Strong emphasis
|
||||
<h1> First-level headline
|
||||
<h2> Second-level headline
|
||||
<h3> Third-level headline
|
||||
<h4> Fourth-level headline
|
||||
<h5> Fifth-level headline
|
||||
<h6> Sixth-level headline
|
||||
<hr> Thematic break
|
||||
<kbd> Text to be entered by the user
|
||||
<pre> Pre-formatted text
|
||||
<q> Short inline quotation
|
||||
<samp> Sample output
|
||||
</pre></code>
|
||||
</main>
|
||||
<footer>
|
||||
<a href="https://git.perin.work/andy/webdev">Download</a>
|
||||
</footer>
|
||||
<script src="../js/code.js"></script>
|
||||
<main>
|
||||
<header>
|
||||
<h1>HTML Semantische Tags</h1>
|
||||
</header>
|
||||
<pre class="line-numbers language-html">
|
||||
<code class=" language-html">
|
||||
<abbr> Abbreviation
|
||||
<acronym> Acronym
|
||||
<blockquote> Long quotation
|
||||
<dfn> Definition
|
||||
<address> Address for author(s) of the document
|
||||
<cite> Citation
|
||||
<code> Code reference
|
||||
<tt> Teletype text
|
||||
<div> Logical division
|
||||
<span> Generic inline style container
|
||||
<del> Deleted text
|
||||
<ins> Inserted text
|
||||
<em> Emphasis
|
||||
<strong> Strong emphasis
|
||||
<h1> First-level headline
|
||||
<h2> Second-level headline
|
||||
<h3> Third-level headline
|
||||
<h4> Fourth-level headline
|
||||
<h5> Fifth-level headline
|
||||
<h6> Sixth-level headline
|
||||
<hr> Thematic break
|
||||
<kbd> Text to be entered by the user
|
||||
<pre> Pre-formatted text
|
||||
<q> Short inline quotation
|
||||
<samp> Sample output
|
||||
</pre></code>
|
||||
</main>
|
||||
<footer>
|
||||
<a href="https://git.perin.work/andy/webdev">Download</a>
|
||||
</footer>
|
||||
<script src="../js/code.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
|
@ -2,75 +2,75 @@
|
|||
<html lang="de">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="Die HTML Struktur in Webseiten">
|
||||
<title>HTML Struktur</title>
|
||||
<link rel="stylesheet" href="../css/code.css">
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="Die HTML Struktur in Webseiten">
|
||||
<title>HTML Struktur</title>
|
||||
<link rel="stylesheet" href="../css/code.css">
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<header>
|
||||
<img src="../img/logo.svg" alt="Mein logo" title="Der Titel meines Bildes">
|
||||
<nav role="navigation">
|
||||
<ul>
|
||||
<li><a title="Zur Startseite" href="#link1">Home</a></li>
|
||||
<li><a title="Unsere News" href="#link2">Aktuell</a></li>
|
||||
<li><a title="Alle Produkte auf einen Blick" href="link3">Produkte</a></li>
|
||||
<li><a title="Dienstleistungen" href="#link4">Service</a></li>
|
||||
<li><a title="Hier sind wir" href="#link5">Kontakt</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
<header>
|
||||
<img src="../img/logo.svg" alt="Mein logo" title="Der Titel meines Bildes">
|
||||
<nav role="navigation">
|
||||
<ul>
|
||||
<li><a title="Zur Startseite" href="#link1">Home</a></li>
|
||||
<li><a title="Unsere News" href="#link2">Aktuell</a></li>
|
||||
<li><a title="Alle Produkte auf einen Blick" href="link3">Produkte</a></li>
|
||||
<li><a title="Dienstleistungen" href="#link4">Service</a></li>
|
||||
<li><a title="Hier sind wir" href="#link5">Kontakt</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<main role="main">
|
||||
<h1>HTML5 Struktur einer Webseite</h1>
|
||||
<article>
|
||||
<h2>Artikel 1</h2>
|
||||
<pre class="language-html">
|
||||
<code class="language-html">
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>HTML Struktur</title>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<nav>
|
||||
<ul>
|
||||
</nav>
|
||||
</header>
|
||||
<main>
|
||||
<h1>Html Struktur einer Webseite</h1>
|
||||
<article>
|
||||
<h2>Artikel 1</h1>
|
||||
</article>
|
||||
<aside>
|
||||
<h2>Artikel 2</h2>
|
||||
</aside>
|
||||
</main>
|
||||
<footer>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
</code>
|
||||
</pre>
|
||||
</article>
|
||||
<main role="main">
|
||||
<h1>HTML5 Struktur einer Webseite</h1>
|
||||
<article>
|
||||
<h2>Artikel 1</h2>
|
||||
<pre class="line-numbers language-html">
|
||||
<code class="language-html"><!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>HTML Struktur</title>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<nav>
|
||||
|
||||
<aside>
|
||||
<h2>Artikel 2</h2>
|
||||
<p>Diese Seite enthält zunächst die Struktur und wenig Inhalt.<br>
|
||||
Das <strong>Bild</strong> erhält ein <strong>title</strong> und ein <strong>alt Attribut</strong>. Die <strong>Links</strong> erhalten ein <strong>title Attribut</strong>.
|
||||
</p>
|
||||
</aside>
|
||||
</main>
|
||||
</nav>
|
||||
</header>
|
||||
<main>
|
||||
<h1>Html Struktur einer Webseite</h1>
|
||||
<article>
|
||||
<h2>Artikel 1</h1>
|
||||
</article>
|
||||
<aside>
|
||||
<h2>Artikel 2</h2>
|
||||
</aside>
|
||||
</main>
|
||||
<footer>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
</code>
|
||||
</pre>
|
||||
</article>
|
||||
|
||||
<footer>
|
||||
<a href="https://git.perin.work/andy/webdev">Download</a>
|
||||
</footer>
|
||||
<script src="../js/code.js"></script>
|
||||
<aside>
|
||||
<h2>Artikel 2</h2>
|
||||
<p>Diese Seite enthält zunächst die Struktur und wenig Inhalt.<br>
|
||||
Das <strong>Bild</strong> erhält ein <strong>title</strong> und ein <strong>alt Attribut</strong>. Die
|
||||
<strong>Links</strong> erhalten ein <strong>title Attribut</strong>.
|
||||
</p>
|
||||
</aside>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
<a href="https://git.perin.work/andy/webdev">Download</a>
|
||||
</footer>
|
||||
<script src="../js/code.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
|
@ -0,0 +1,67 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="Die HTML Struktur in Webseiten">
|
||||
<title>HTML Struktur</title>
|
||||
<link rel="stylesheet" href="css/code.css">
|
||||
<link rel="stylesheet" href="css/style.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<header>
|
||||
<img src="img/logo.svg" alt="Mein logo" title="Der Titel meines Bildes">
|
||||
<nav role="navigation">
|
||||
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<main role="main">
|
||||
<h1 id="webdeveloper-links-tips">Webdeveloper Links & Tips</h1>
|
||||
<h2 id="html">HTML</h2>
|
||||
<h3 id="html-lernen">HTML lernen</h3>
|
||||
<ul>
|
||||
<li><a href="https://wiki.selfhtml.org/wiki/HTML">selfhtml</a></li>
|
||||
<li><a href="https://developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_HTML">Introduction to HTML
|
||||
- Mozilla Docs</a></li>
|
||||
<li><a href="https://www.w3schools.com/html/">w3schools HTML5 Tutorial</a></li>
|
||||
</ul>
|
||||
<h3 id="editoren">Editoren</h3>
|
||||
<ul>
|
||||
<li><a href="https://www.sublimetext.com/">Sublime Text</a></li>
|
||||
<li><a href="https://code.visualstudio.com/">Visual Studio Code</a></li>
|
||||
<li><a href="https://atom.io/">Atom editor</a></li>
|
||||
<li><a href="http://brackets.io/">Brackets</a></li>
|
||||
</ul>
|
||||
<h3 id="online-tools-plugins">Online Tools / Plugins</h3>
|
||||
<ul>
|
||||
<li><a href="https://validator.w3.org/">HTML Validator</a></li>
|
||||
<li><a href="https://html5.validator.nu/">HTML nu Validator</a></li>
|
||||
<li><a href="https://chrome.google.com/webstore/search/html?hl=de&_category=extensions">HTML Extension
|
||||
Chromium</a></li>
|
||||
<li><a href="https://addons.mozilla.org/de/firefox/search/?q=html&type=extension">HTML Extension
|
||||
Mozilla</a></li>
|
||||
<li><a href="https://www.caniuse.com/">Can I use</a></li>
|
||||
<li><a href="https://codepen.io/">codepen</a></li>
|
||||
<li><a href="https://jsfiddle.net/">jsfiddle</a></li>
|
||||
<li><a href="https://search.google.com/search-console">Google Search Console</a></li>
|
||||
<li><a href="https://www.browserling.com/">Cross Browser testing</a></li>
|
||||
<li><a href="https://html5test.com/">Browser Test</a></li>
|
||||
</ul>
|
||||
<h3>Interne Links</h3>
|
||||
<ul>
|
||||
<li><a href="html/semantik.html">Semantische Tags</a></li>
|
||||
<li><a href="html/struktur.html">Seitenstruktur</a></p>
|
||||
</li>
|
||||
<li><a href="html/header.html">Kopfbereich</a></p>
|
||||
</li>
|
||||
</ul>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
<a href="https://git.perin.work/andy/webdev">Download</a>
|
||||
</footer>
|
||||
<script src="../js/code.js"></script>
|
||||
</body>
|
||||
|
|
@ -5,3 +5,5 @@ Prism.languages.markup={comment:/<!--[\s\S]*?-->/,prolog:/<\?[\s\S]+?\?>/,doctyp
|
|||
!function(s){var e=/("|')(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/;s.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:/@[\w-]+[\s\S]*?(?:;|(?=\s*\{))/,inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\((?!\s*\))\s*)(?:[^()]|\((?:[^()]|\([^()]*\))*\))+?(?=\s*\))/,lookbehind:!0,alias:"selector"}}},url:{pattern:RegExp("url\\((?:"+e.source+"|[^\n\r()]*)\\)","i"),inside:{function:/^url/i,punctuation:/^\(|\)$/}},selector:RegExp("[^{}\\s](?:[^{};\"']|"+e.source+")*?(?=\\s*\\{)"),string:{pattern:e,greedy:!0},property:/[-_a-z\xA0-\uFFFF][-\w\xA0-\uFFFF]*(?=\s*:)/i,important:/!important\b/i,function:/[-a-z0-9]+(?=\()/i,punctuation:/[(){};:,]/},s.languages.css.atrule.inside.rest=s.languages.css;var t=s.languages.markup;t&&(t.tag.addInlined("style","css"),s.languages.insertBefore("inside","attr-value",{"style-attr":{pattern:/\s*style=("|')(?:\\[\s\S]|(?!\1)[^\\])*\1/i,inside:{"attr-name":{pattern:/^\s*style/i,inside:t.tag.inside},punctuation:/^\s*=\s*['"]|['"]\s*$/,"attr-value":{pattern:/.+/i,inside:s.languages.css}},alias:"language-css"}},t.tag))}(Prism);
|
||||
Prism.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/(\b(?:class|interface|extends|implements|trait|instanceof|new)\s+|\bcatch\s+\()[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:if|else|while|do|for|return|in|instanceof|function|new|try|throw|catch|finally|null|break|continue)\b/,boolean:/\b(?:true|false)\b/,function:/\w+(?=\()/,number:/\b0x[\da-f]+\b|(?:\b\d+\.?\d*|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/};
|
||||
Prism.languages.javascript=Prism.languages.extend("clike",{"class-name":[Prism.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])[_$A-Z\xA0-\uFFFF][$\w\xA0-\uFFFF]*(?=\.(?:prototype|constructor))/,lookbehind:!0}],keyword:[{pattern:/((?:^|})\s*)(?:catch|finally)\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],number:/\b(?:(?:0[xX](?:[\dA-Fa-f](?:_[\dA-Fa-f])?)+|0[bB](?:[01](?:_[01])?)+|0[oO](?:[0-7](?:_[0-7])?)+)n?|(?:\d(?:_\d)?)+n|NaN|Infinity)\b|(?:\b(?:\d(?:_\d)?)+\.?(?:\d(?:_\d)?)*|\B\.(?:\d(?:_\d)?)+)(?:[Ee][+-]?(?:\d(?:_\d)?)+)?/,function:/#?[_$a-zA-Z\xA0-\uFFFF][$\w\xA0-\uFFFF]*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,operator:/--|\+\+|\*\*=?|=>|&&|\|\||[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?[.?]?|[~:]/}),Prism.languages.javascript["class-name"][0].pattern=/(\b(?:class|interface|extends|implements|instanceof|new)\s+)[\w.\\]+/,Prism.languages.insertBefore("javascript","keyword",{regex:{pattern:/((?:^|[^$\w\xA0-\uFFFF."'\])\s])\s*)\/(?:\[(?:[^\]\\\r\n]|\\.)*]|\\.|[^/\\\[\r\n])+\/[gimyus]{0,6}(?=(?:\s|\/\*[\s\S]*?\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/,lookbehind:!0,greedy:!0},"function-variable":{pattern:/#?[_$a-zA-Z\xA0-\uFFFF][$\w\xA0-\uFFFF]*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|[_$a-zA-Z\xA0-\uFFFF][$\w\xA0-\uFFFF]*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+[_$A-Za-z\xA0-\uFFFF][$\w\xA0-\uFFFF]*)?\s*\(\s*)(?!\s)(?:[^()]|\([^()]*\))+?(?=\s*\))/,lookbehind:!0,inside:Prism.languages.javascript},{pattern:/[_$a-z\xA0-\uFFFF][$\w\xA0-\uFFFF]*(?=\s*=>)/i,inside:Prism.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()]|\([^()]*\))+?(?=\s*\)\s*=>)/,lookbehind:!0,inside:Prism.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:[_$A-Za-z\xA0-\uFFFF][$\w\xA0-\uFFFF]*\s*)\(\s*)(?!\s)(?:[^()]|\([^()]*\))+?(?=\s*\)\s*\{)/,lookbehind:!0,inside:Prism.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/}),Prism.languages.insertBefore("javascript","string",{"template-string":{pattern:/`(?:\\[\s\S]|\${(?:[^{}]|{(?:[^{}]|{[^}]*})*})+}|(?!\${)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\${(?:[^{}]|{(?:[^{}]|{[^}]*})*})+}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\${|}$/,alias:"punctuation"},rest:Prism.languages.javascript}},string:/[\s\S]+/}}}),Prism.languages.markup&&Prism.languages.markup.tag.addInlined("script","javascript"),Prism.languages.js=Prism.languages.javascript;
|
||||
|
||||
!function(){if("undefined"!=typeof self&&self.Prism&&self.document){var l="line-numbers",c=/\n(?!$)/g,m=function(e){var t=a(e)["white-space"];if("pre-wrap"===t||"pre-line"===t){var n=e.querySelector("code"),r=e.querySelector(".line-numbers-rows"),s=e.querySelector(".line-numbers-sizer"),i=n.textContent.split(c);s||((s=document.createElement("span")).className="line-numbers-sizer",n.appendChild(s)),s.style.display="block",i.forEach(function(e,t){s.textContent=e||"\n";var n=s.getBoundingClientRect().height;r.children[t].style.height=n+"px"}),s.textContent="",s.style.display="none"}},a=function(e){return e?window.getComputedStyle?getComputedStyle(e):e.currentStyle||null:null};window.addEventListener("resize",function(){Array.prototype.forEach.call(document.querySelectorAll("pre."+l),m)}),Prism.hooks.add("complete",function(e){if(e.code){var t=e.element,n=t.parentNode;if(n&&/pre/i.test(n.nodeName)&&!t.querySelector(".line-numbers-rows")){for(var r=!1,s=/(?:^|\s)line-numbers(?:\s|$)/,i=t;i;i=i.parentNode)if(s.test(i.className)){r=!0;break}if(r){t.className=t.className.replace(s," "),s.test(n.className)||(n.className+=" line-numbers");var l,a=e.code.match(c),o=a?a.length+1:1,u=new Array(o+1).join("<span></span>");(l=document.createElement("span")).setAttribute("aria-hidden","true"),l.className="line-numbers-rows",l.innerHTML=u,n.hasAttribute("data-start")&&(n.style.counterReset="linenumber "+(parseInt(n.getAttribute("data-start"),10)-1)),e.element.appendChild(l),m(n),Prism.hooks.run("line-numbers",e)}}}}),Prism.hooks.add("line-numbers",function(e){e.plugins=e.plugins||{},e.plugins.lineNumbers=!0}),Prism.plugins.lineNumbers={getLine:function(e,t){if("PRE"===e.tagName&&e.classList.contains(l)){var n=e.querySelector(".line-numbers-rows"),r=parseInt(e.getAttribute("data-start"),10)||1,s=r+(n.children.length-1);t<r&&(t=r),s<t&&(t=s);var i=t-r;return n.children[i]}}}}}();
|
||||
Loading…
Reference in New Issue