/
example.en-us.default-dark-colored-theme.html
757 lines (755 loc) · 239 KB
/
example.en-us.default-dark-colored-theme.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge"><title>Wulechuan's Article CSS Styles Examples</title>
<style>
/*!
* 本层叠样式表用于定义一篇超文本标记语言存储之文章之排版、配色等，
* 以期美化文章版面、改善文章的可读性，并奢望给文章之读者带去额外愉悦。
* 本套样式乃是有吴乐川研发之专门工具构建而得。
* 该工具名为“吴乐川的 HTML 文章排版与配色之方案集”，
* 又名“@wulechuan/css-stylus-markdown-themes”。
*
* This is a wulechuan's theming css for
* an HTML file generated via a MarkDown file.
* This css is generated by a tool of wulechuan's,
* named "@wulechuan/css-stylus-markdown-themes".
*
*
*
* 吾乃南昌吴乐川是也
* wulechuan@live.com
* 2022-05-14
*
*
*
* 上文所提及之工具之主页网址（ homepage of the metioned tool ）：
* - https://www.npmjs.com/package/@wulechuan/css-stylus-markdown-themes
*
* 上午所提及之工具之源代码仓库网址（ repos of the metioned tool ）：
* - https://gitee.com/nanchang-wulechuan/wulechuan-css-stylus-themes-for-htmls-via-markdowns.git
* - https://code.aliyun.com/wulechuan/wulechuan-themes-for-htmls-via-markdowns.git
* - https://github.com/wulechuan/wulechuan-css-stylus-themes-for-htmls-via-markdowns.git
*/.markdown-article{font-size:20px}@media screen and (min-width:2190px){.markdown-article{font-size:28px}}@media screen and (min-width:2879px){.markdown-article{font-size:40px}}@media screen and (max-width:600px){.markdown-article{font-size:16px}}body{margin:0;padding:4.0625em 1.25em 7.5em}@media screen and (min-width:2190px){body{padding:5.6875em 1.75em 10.5em}}@media screen and (min-width:2879px){body{padding:8.125em 2.5em 15em}}@media (max-width:600px){body{padding:0}}[lang*=-CN i],[lang*=-CN],[lang*=-hans i],[lang*=-hans],[lang*=zh- i],[lang*=zh-]{letter-spacing:.1em}a{font-size:inherit;text-shadow:inherit}a:not([href]){font-style:italic}a[href]{cursor:pointer;text-decoration-line:underline;text-decoration-style:solid;text-underline-offset:.2em}a[href^="#"]{text-decoration-style:dotted}a[href]:hover{text-decoration-color:currentColor}s a,s a:hover{color:inherit;text-decoration-color:inherit;text-decoration-line:inherit;text-decoration-style:inherit;text-decoration-thickness:inherit}a[href] s,a[href] s:hover,s a[href],s a[href]:hover{text-decoration-line:line-through underline}s{text-decoration-line:line-through;text-decoration-style:solid}dt,h1,h2,h3,h4,h5,h6{border-width:0;cursor:text;text-indent:0}h1,h2{margin-left:0;margin-right:0;padding-left:.75em;padding-right:.75em;text-align:center}h1 p,h1 small,h2 p,h2 small{display:flex;flex-direction:row;font-size:.667em;justify-content:center;line-height:1.33;margin-top:.5em;text-align:justify}h1 p small,h1 small p,h2 p small,h2 small p{font-size:100%}[lang*=-CN i] h1,[lang*=-CN i] h2,[lang*=-CN] h1,[lang*=-CN] h2,[lang*=-hans i] h1,[lang*=-hans i] h2,[lang*=-hans] h1,[lang*=-hans] h2,[lang*=zh- i] h1,[lang*=zh- i] h2,[lang*=zh-] h1,[lang*=zh-] h2{letter-spacing:.1em}[lang*=-CN i] h1 p,[lang*=-CN i] h1 small,[lang*=-CN i] h2 p,[lang*=-CN i] h2 small,[lang*=-CN] h1 p,[lang*=-CN] h1 small,[lang*=-CN] h2 p,[lang*=-CN] h2 small,[lang*=-hans i] h1 p,[lang*=-hans i] h1 small,[lang*=-hans i] h2 p,[lang*=-hans i] h2 small,[lang*=-hans] h1 p,[lang*=-hans] h1 small,[lang*=-hans] h2 p,[lang*=-hans] h2 small,[lang*=zh- i] h1 p,[lang*=zh- i] h1 small,[lang*=zh- i] h2 p,[lang*=zh- i] h2 small,[lang*=zh-] h1 p,[lang*=zh-] h1 small,[lang*=zh-] h2 p,[lang*=zh-] h2 small{margin-left:3.7em;text-indent:-2.7em}h3,h4,h5,h6{margin-left:-.75em;margin-right:-.75em;padding-left:.75em;padding-right:.75em;text-align:justify}h1{font-size:2.75em;margin-top:3em}h1,h2{line-height:1.333;margin-bottom:1em;padding-bottom:.5em;padding-top:.5em}h2{font-size:2.2em;margin-top:4em}h3{font-size:1.75em;margin-top:3.5em}h3,h4{line-height:1.333;margin-bottom:1em;padding-bottom:.5em;padding-top:.5em}h4{font-size:1.33em;margin-top:3em}h5{font-size:1.2em;margin-top:3em}dt,h5,h6{line-height:1.333;margin-bottom:.75em;padding-bottom:.5em;padding-top:.5em}dt,h6{font-size:1.1em;margin-top:1.5em}dt{margin-left:-.5em;margin-right:-.5em;padding-left:.5em;padding-right:.5em;text-align:justify}h2+h3,h3+h4,h4+h5,h5+h6{margin-top:-1em}blockquote>h1,blockquote>h2,blockquote>h3,blockquote>h4,blockquote>h5,blockquote>h6,td>h1,td>h2,td>h3,td>h4,td>h5,td>h6,th>h1,th>h2,th>h3,th>h4,th>h5,th>h6{margin-bottom:.25em;margin-top:.75em;padding-bottom:.25em;padding-top:.25em}blockquote>h1~p:last-child,blockquote>h2~p:last-child,blockquote>h3~p:last-child,blockquote>h4~p:last-child,td>h1~p:last-child,td>h2~p:last-child,td>h3~p:last-child,td>h4~p:last-child,th>h1~p:last-child,th>h2~p:last-child,th>h3~p:last-child,th>h4~p:last-child{margin-bottom:1.25em}[lang*=-CN i] blockquote>h1,[lang*=-CN i] blockquote>h2,[lang*=-CN i] blockquote>h3,[lang*=-CN i] blockquote>h4,[lang*=-CN i] blockquote>h5,[lang*=-CN i] blockquote>h6,[lang*=-CN] blockquote>h1,[lang*=-CN] blockquote>h2,[lang*=-CN] blockquote>h3,[lang*=-CN] blockquote>h4,[lang*=-CN] blockquote>h5,[lang*=-CN] blockquote>h6,[lang*=-hans i] blockquote>h1,[lang*=-hans i] blockquote>h2,[lang*=-hans i] blockquote>h3,[lang*=-hans i] blockquote>h4,[lang*=-hans i] blockquote>h5,[lang*=-hans i] blockquote>h6,[lang*=-hans] blockquote>h1,[lang*=-hans] blockquote>h2,[lang*=-hans] blockquote>h3,[lang*=-hans] blockquote>h4,[lang*=-hans] blockquote>h5,[lang*=-hans] blockquote>h6,[lang*=zh- i] blockquote>h1,[lang*=zh- i] blockquote>h2,[lang*=zh- i] blockquote>h3,[lang*=zh- i] blockquote>h4,[lang*=zh- i] blockquote>h5,[lang*=zh- i] blockquote>h6,[lang*=zh-] blockquote>h1,[lang*=zh-] blockquote>h2,[lang*=zh-] blockquote>h3,[lang*=zh-] blockquote>h4,[lang*=zh-] blockquote>h5,[lang*=zh-] blockquote>h6,blockquote>h1,blockquote>h2,blockquote>h3,blockquote>h4,blockquote>h5,blockquote>h6{margin-left:-.75em;margin-right:-.75em;padding-left:.75em;padding-right:.75em}p{cursor:text;margin:1em;padding:.25em .5em;text-align:justify}blockquote>p{margin:.5em}blockquote>p:first-child{margin-top:1em}blockquote>p:last-child{margin-bottom:.75em}blockquote>p:only-of-type{margin:.25em 0;text-indent:0}li>p{margin-left:-.5em;margin-right:-.5em}h1+p,h2+p,h3+p,h4+p,h5+p,h6+p{margin-top:0}center,center>*{text-align:center}[lang*=-CN i] p,[lang*=-CN] p,[lang*=-hans i] p,[lang*=-hans] p,[lang*=zh- i] p,[lang*=zh-] p{text-indent:2.2em}[lang*=-CN i] li>p:first-child,[lang*=-CN i] li>p:only-of-type,[lang*=-CN] li>p:first-child,[lang*=-CN] li>p:only-of-type,[lang*=-hans i] li>p:first-child,[lang*=-hans i] li>p:only-of-type,[lang*=-hans] li>p:first-child,[lang*=-hans] li>p:only-of-type,[lang*=zh- i] li>p:first-child,[lang*=zh- i] li>p:only-of-type,[lang*=zh-] li>p:first-child,[lang*=zh-] li>p:only-of-type{text-indent:0}[lang*=-CN i] blockquote>p:only-of-type,[lang*=-CN] blockquote>p:only-of-type,[lang*=-hans i] blockquote>p:only-of-type,[lang*=-hans] blockquote>p:only-of-type,[lang*=zh- i] blockquote>p:only-of-type,[lang*=zh-] blockquote>p:only-of-type{text-indent:0}[lang*=-CN i] center p,[lang*=-CN] center p,[lang*=-hans i] center p,[lang*=-hans] center p,[lang*=zh- i] center p,[lang*=zh-] center p{text-indent:0}sub,sup{margin-right:.5em}small,sub,sup{font-size:75%}a em,a strong,s em,s strong{text-decoration-color:inherit;text-decoration-line:inherit;text-decoration-style:inherit;text-decoration-thickness:inherit}img{border-style:none;box-sizing:content-box;display:block;font-size:100%;font-style:italic;font-weight:400;margin:.5em auto 1em;max-width:75%;padding:.5em;text-align:center;text-indent:0;white-space:normal;word-break:break-word}img:before{content:"Image failed to load. No description of the image."}img[alt]:before{content:'Image failed to load. Image description: \A"'}img[alt]:after{content:'"'}@-moz-document url-prefix(){img:after,img[alt]:after{content:" (Image failed to load)"}}[lang*=-CN i] img:before,[lang*=-CN] img:before,[lang*=-hans i] img:before,[lang*=-hans] img:before,[lang*=zh- i] img:before,[lang*=zh-] img:before{content:"图片加载失败。图片内容未知。"}[lang*=-CN i] img[alt]:before,[lang*=-CN] img[alt]:before,[lang*=-hans i] img[alt]:before,[lang*=-hans] img[alt]:before,[lang*=zh- i] img[alt]:before,[lang*=zh-] img[alt]:before{content:"图片加载失败。图片内容的大致描述为：\A“"}[lang*=-CN i] img[alt]:after,[lang*=-CN] img[alt]:after,[lang*=-hans i] img[alt]:after,[lang*=-hans] img[alt]:after,[lang*=zh- i] img[alt]:after,[lang*=zh-] img[alt]:after{content:"”"}@-moz-document url-prefix(){[lang*=-CN i] img:after,[lang*=-CN i] img[alt]:after,[lang*=-CN] img:after,[lang*=-CN] img[alt]:after,[lang*=-hans i] img:after,[lang*=-hans i] img[alt]:after,[lang*=-hans] img:after,[lang*=-hans] img[alt]:after,[lang*=zh- i] img:after,[lang*=zh- i] img[alt]:after,[lang*=zh-] img:after,[lang*=zh-] img[alt]:after{content:"（图片加载失败）"}}video{display:block;margin:1.5em auto;width:calc(100% - 1em)}blockquote{border-style:solid;box-sizing:border-box;display:inline-block;margin:0 1em 1.5em 2.5em;max-width:calc(100% - 3.5em);padding:.25em 1.5em .25em 1em;vertical-align:top}details{margin:.5em 1.5em 1.5em;padding:.5em 1.5em}li>details{margin-left:0;margin-right:0}summary{cursor:pointer;font-size:1.1em;font-weight:700;margin:.25em -.25em;padding:.15em .5em .15em 1em;text-indent:-.85em}pre+details{margin-top:-.5em}code,kbd,pre{font-weight:350;text-indent:0}code,kbd{border-style:solid;display:inline-block;font-style:normal;line-height:1.25;min-height:1em;min-width:.5em;padding-left:.25em;padding-right:.25em;vertical-align:baseline}kbd{margin:-.15em .2em;padding:.15em .3em;position:relative;top:-.15em}code{cursor:text;font-size:inherit;margin:.1em;padding:.15em .2em;white-space:pre-wrap;word-break:break-all}[lang*=-CN i] code,[lang*=-CN] code,[lang*=-hans i] code,[lang*=-hans] code,[lang*=zh- i] code,[lang*=zh-] code{padding-left:.25em}em code,strong code{font-style:inherit;font-weight:inherit}a code,s code{color:inherit;text-decoration-color:inherit;text-decoration-line:inherit;text-decoration-style:inherit;text-decoration-thickness:inherit}a code{cursor:pointer}kbd{font-size:80%;letter-spacing:0}pre{box-sizing:border-box;display:block;margin:.5em 2em 2em;max-height:75vh;overflow:auto;padding:0 5em 0 0;white-space:nowrap}pre,pre>code{word-wrap:normal;cursor:auto;letter-spacing:0;line-height:1.6;position:static;text-align:left!important;top:auto;white-space:pre;word-break:keep-all}pre>code{border:none!important;border-radius:0;box-sizing:border-box;display:inline-block}[lang*=-CN i] pre>code,[lang*=-CN] pre>code,[lang*=-hans i] pre>code,[lang*=-hans] pre>code,[lang*=zh- i] pre>code,[lang*=zh-] pre>code,pre>code{margin:0!important;padding:.5em 1em}li>pre,td>pre{margin-left:0;margin-right:0}td>pre{margin-right:0;padding-right:0}li>pre:first-child{display:inline-block;margin-top:0;vertical-align:top;width:100%}blockquote>pre:first-child,td>pre:first-child{margin-top:1.5em}blockquote>pre:last-child,td>pre:last-child{margin-bottom:1em}blockquote>pre:first-child:last-child,td>pre:first-child:last-child{margin-bottom:.5em;margin-top:.5em}details>pre{margin-left:0;margin-right:0}details>pre:last-child{margin-bottom:.5em}input[type=checkbox]{display:inline-block;height:1.4em;margin:-.2em .6em 0 0;vertical-align:middle;width:1.4em}label[for]{cursor:pointer}dd,li{text-align:justify}li{margin:1em 0;padding:0 .5em}dt{border-width:0;padding-bottom:.5em;padding-top:.5em}dl,ol,ul{margin:.5em auto 1.5em}blockquote dd:last-child,blockquote ol:last-child,blockquote ul:last-child{margin-bottom:.5em}ol,ul{padding:0 1em 0 3em}@-moz-document url-prefix(){ol,ul{padding-left:2.5em}li::marker{margin-right:.7em}}table,td,th,tr{border-style:solid;border-width:0}td,th{min-width:3em;padding:.25em .75em;text-align:justify}table{border-collapse:collapse;margin:1em auto;max-width:96%;min-width:64%}hr{background-color:transparent;border-width:0;display:block;height:1px;margin:3em auto 4em 0;overflow:visible!important;position:relative;width:calc(50% - .6em)}hr:after,hr:before{content:"";display:block;position:absolute}hr:before{background-color:currentColor;border-radius:50%;height:.4em;left:calc(100% + .6em);margin:-.2em 0 0 -.2em;top:49.5%;width:.4em}hr:after{background-color:inherit;background-image:inherit!important;height:100%;left:100%;margin-left:1.2em;transform:scaleX(-1);width:100%}@media (max-width:900px){pre{margin-left:0;margin-right:0}pre,table{max-width:100%}}@media (max-width:600px){h1,h2{margin-left:-.5em;margin-right:-.5em;padding-left:1.2em;text-align:justify}h3,h4,h5,h6{padding-left:1.25em}h1{font-size:2.25em}h2{font-size:1.9em}h3{font-size:1.6em}h4{font-size:1.3em}h5{font-size:1.2em}dt,h6{font-size:1.1em}ol,ul{padding-left:1.8em;padding-right:0}p{margin-left:.25em;margin-right:.25em}blockquote{max-width:100%;padding-left:1em;padding-right:1em}blockquote,details{margin-left:0;margin-right:0}table{max-width:100%}td{max-width:400px}pre{margin-left:0;margin-right:0}table pre>code{white-space:normal!important;word-break:break-all}hr{margin:1.5em auto 2em 0}video{width:100%}}.markdown-article{line-height:1.8;margin:0 auto;max-width:51em;min-height:60em;padding:6em 4em 14em;scroll-behavior:smooth;word-break:break-word}.markdown-article>h1:first-child{margin-top:1em}.article-author,.author,.centered,.document-author,.text-centered{text-align:center;text-indent:0}.align-rightwards,.text-align-rightwards,.texts-align-rightwards{text-align:right;text-indent:0}[lang*=-CN i] .article-author,[lang*=-CN i] .author,[lang*=-CN i] .document-author,[lang*=-CN] .article-author,[lang*=-CN] .author,[lang*=-CN] .document-author,[lang*=-hans i] .article-author,[lang*=-hans i] .author,[lang*=-hans i] .document-author,[lang*=-hans] .article-author,[lang*=-hans] .author,[lang*=-hans] .document-author,[lang*=zh- i] .article-author,[lang*=zh- i] .author,[lang*=zh- i] .document-author,[lang*=zh-] .article-author,[lang*=zh-] .author,[lang*=zh-] .document-author{text-indent:0}[lang*=-CN i] .centered,[lang*=-CN i] .text-centered,[lang*=-CN] .centered,[lang*=-CN] .text-centered,[lang*=-hans i] .centered,[lang*=-hans i] .text-centered,[lang*=-hans] .centered,[lang*=-hans] .text-centered,[lang*=zh- i] .centered,[lang*=zh- i] .text-centered,[lang*=zh-] .centered,[lang*=zh-] .text-centered{text-indent:0}[lang*=-CN i] .align-rightwards,[lang*=-CN i] .text-align-rightwards,[lang*=-CN i] .texts-align-rightwards,[lang*=-CN] .align-rightwards,[lang*=-CN] .text-align-rightwards,[lang*=-CN] .texts-align-rightwards,[lang*=-hans i] .align-rightwards,[lang*=-hans i] .text-align-rightwards,[lang*=-hans i] .texts-align-rightwards,[lang*=-hans] .align-rightwards,[lang*=-hans] .text-align-rightwards,[lang*=-hans] .texts-align-rightwards,[lang*=zh- i] .align-rightwards,[lang*=zh- i] .text-align-rightwards,[lang*=zh- i] .texts-align-rightwards,[lang*=zh-] .align-rightwards,[lang*=zh-] .text-align-rightwards,[lang*=zh-] .texts-align-rightwards{text-indent:0}.hidden-spacebar-between-head-linkage-and-head-text{display:inline-block;height:1px;margin-right:-1px;overflow:hidden;width:1px}.header-anchor,a.header-anchor{border-radius:.25em;box-sizing:border-box;display:inline-block;font-weight:400;letter-spacing:0;line-height:1;margin:-.1667em .15em 0 -1.65em;min-width:1.5em;padding:.25em 0;text-align:center;text-decoration-line:none;vertical-align:middle}blockquote>h1 .header-anchor,blockquote>h2 .header-anchor,blockquote>h3 .header-anchor,blockquote>h4 .header-anchor,blockquote>h5 .header-anchor,blockquote>h6 .header-anchor,td>h1 .header-anchor,td>h2 .header-anchor,td>h3 .header-anchor,td>h4 .header-anchor,td>h5 .header-anchor,td>h6 .header-anchor,th>h1 .header-anchor,th>h2 .header-anchor,th>h3 .header-anchor,th>h4 .header-anchor,th>h5 .header-anchor,th>h6 .header-anchor{display:none}@media (max-width:900px){.header-anchor,a.header-anchor{margin-left:-1.35em;margin-right:.15em;min-width:1.2em}.markdown-article{padding-bottom:7em;padding-top:3em}.markdown-article,.markdown-article-toc-is-visible .markdown-article{padding-left:3em;padding-right:3em}}@media (max-width:600px){.header-anchor,a.header-anchor{margin-left:-1.2em;margin-right:.2em;min-width:1em}.markdown-article,.markdown-article-toc-is-visible .markdown-article{padding-left:1.5em;padding-right:1.5em}}.markdown-article-back-to-top{font-size:20px}@media screen and (min-width:2190px){.markdown-article-back-to-top{font-size:28px}}@media screen and (min-width:2879px){.markdown-article-back-to-top{font-size:40px}}@media screen and (max-width:600px){.markdown-article-back-to-top{font-size:16px}}@media screen{.markdown-article-back-to-top{align-items:center;border:0;bottom:1.5em;box-sizing:border-box;cursor:pointer;display:flex;height:2.5em;justify-content:center;margin:.5em;outline:none;overflow:hidden;padding:0;position:fixed;right:0;width:2.5em;z-index:51}.markdown-article-back-to-top:before{border:0;border-radius:50%;box-sizing:content-box;content:"";display:block;height:2em;margin:0;width:2em}.markdown-article-back-to-top:after{border:.32em solid transparent;border-bottom-color:currentcolor;bottom:.36em;box-sizing:content-box;content:"";display:block;height:0;left:.25em;margin:auto;position:absolute;right:.25em;top:0;width:0}}@media screen and (max-width:600px){.markdown-article-back-to-top{margin-right:-.5em}}@media print{.markdown-article-back-to-top{display:none}}nav.markdown-article-toc{z-index:75}.markdown-article-toc-toggling-button{z-index:79}nav.markdown-article-toc{font-size:20px}@media screen and (min-width:2190px){nav.markdown-article-toc{font-size:28px}}@media screen and (min-width:2879px){nav.markdown-article-toc{font-size:40px}}@media screen and (max-width:600px){nav.markdown-article-toc{font-size:16px}}@media screen{nav.markdown-article-toc{box-sizing:border-box;display:flex;flex-direction:column;height:100%;left:0;margin:0;max-width:100%;overflow:auto;padding:3.5em .5em 1.5em;position:fixed;top:0;user-select:text;width:28em}nav.markdown-article-toc ol,nav.markdown-article-toc ul{counter-reset:wlc-article-toc;margin:0 0 2em}nav.markdown-article-toc>ol,nav.markdown-article-toc>ul{box-sizing:border-box;font-size:.8em;height:100%;margin-bottom:0;overflow:auto;padding-bottom:4.5em;padding-right:.5em;padding-top:.5em}nav.markdown-article-toc>ol ol,nav.markdown-article-toc>ul ol{padding:0 0 0 .5em}nav.markdown-article-toc>ol ul,nav.markdown-article-toc>ul ul{padding:0 0 0 1.5em}nav.markdown-article-toc>ol>li>ul,nav.markdown-article-toc>ul>li>ul{padding-left:2.5em}nav.markdown-article-toc>ol{padding-left:.5em}nav.markdown-article-toc>ul{list-style:none;padding-left:1em}nav.markdown-article-toc.should-show-2-levels-at-most>ol>li>ol>li ol,nav.markdown-article-toc.should-show-2-levels-at-most>ol>li>ol>li ul,nav.markdown-article-toc.should-show-2-levels-at-most>ol>li>ul>li ol,nav.markdown-article-toc.should-show-2-levels-at-most>ol>li>ul>li ul,nav.markdown-article-toc.should-show-2-levels-at-most>ul>li>ol>li ol,nav.markdown-article-toc.should-show-2-levels-at-most>ul>li>ol>li ul,nav.markdown-article-toc.should-show-2-levels-at-most>ul>li>ul>li ol,nav.markdown-article-toc.should-show-2-levels-at-most>ul>li>ul>li ul{display:none}nav.markdown-article-toc li{cursor:pointer;line-height:1.5;margin:.25em 0;padding-right:0;position:relative}nav.markdown-article-toc li:before,nav.markdown-article-toc li>a[href^="#"]{border-style:solid none;border-width:1px 0;display:block;padding-bottom:.25em;padding-top:.25em;transition-duration:.36s;transition-property:color,background-color,border-color;transition-timing-function:ease-out}nav.markdown-article-toc li:before{border-color:transparent;left:0;margin:0;position:absolute;text-align:right;top:0}nav.markdown-article-toc li>a[href^="#"]{margin-bottom:0;margin-right:0;margin-top:0;padding-right:.5em;text-decoration-line:none}nav.markdown-article-toc ol>li{counter-increment:wlc-article-toc;list-style-type:none;padding-left:4.75em}nav.markdown-article-toc ol>li:before{width:4.75em}nav.markdown-article-toc ol>li>a[href^="#"]{margin-left:-4.75em;padding-left:5.75em}nav.markdown-article-toc ol>li:before{content:counters(wlc-article-toc,".",wlc-article-toc)}nav.markdown-article-toc>ol{margin-left:0}nav.markdown-article-toc>ol>li{padding-left:2em}nav.markdown-article-toc>ol>li:before{width:2em}nav.markdown-article-toc>ol>li>a[href^="#"]{margin-left:-2em;padding-left:3em}nav.markdown-article-toc>ol>li>ol,nav.markdown-article-toc>ul>li>ol{margin-left:-1em}nav.markdown-article-toc>ol>li>ol>li,nav.markdown-article-toc>ul>li>ol>li{padding-left:2.75em}nav.markdown-article-toc>ol>li>ol>li:before,nav.markdown-article-toc>ul>li>ol>li:before{width:2.75em}nav.markdown-article-toc>ol>li>ol>li>a[href^="#"],nav.markdown-article-toc>ul>li>ol>li>a[href^="#"]{margin-left:-2.75em;padding-left:3.75em}nav.markdown-article-toc>ol>li>ol>li>ol,nav.markdown-article-toc>ol>li>ul>li>ol,nav.markdown-article-toc>ul>li>ol>li>ol,nav.markdown-article-toc>ul>li>ul>li>ol{margin-left:-1.75em}nav.markdown-article-toc>ol>li>ol>li>ol>li,nav.markdown-article-toc>ol>li>ul>li>ol>li,nav.markdown-article-toc>ul>li>ol>li>ol>li,nav.markdown-article-toc>ul>li>ul>li>ol>li{padding-left:3.75em}nav.markdown-article-toc>ol>li>ol>li>ol>li:before,nav.markdown-article-toc>ol>li>ul>li>ol>li:before,nav.markdown-article-toc>ul>li>ol>li>ol>li:before,nav.markdown-article-toc>ul>li>ul>li>ol>li:before{width:3.75em}nav.markdown-article-toc>ol>li>ol>li>ol>li>a[href^="#"],nav.markdown-article-toc>ol>li>ul>li>ol>li>a[href^="#"],nav.markdown-article-toc>ul>li>ol>li>ol>li>a[href^="#"],nav.markdown-article-toc>ul>li>ul>li>ol>li>a[href^="#"]{margin-left:-3.75em;padding-left:4.75em}nav.markdown-article-toc>ol>li>ol>li>ol>li>ol,nav.markdown-article-toc>ol>li>ol>li>ul>li>ol,nav.markdown-article-toc>ol>li>ul>li>ol>li>ol,nav.markdown-article-toc>ol>li>ul>li>ul>li>ol,nav.markdown-article-toc>ul>li>ol>li>ol>li>ol,nav.markdown-article-toc>ul>li>ol>li>ul>li>ol,nav.markdown-article-toc>ul>li>ul>li>ol>li>ol,nav.markdown-article-toc>ul>li>ul>li>ul>li>ol{margin-left:-2.5em}nav.markdown-article-toc ul>li{padding-left:.5em}nav.markdown-article-toc ul>li>a[href^="#"]{margin-left:-.5em;padding-left:1em}}.markdown-article-toc-toggling-button{font-size:20px}@media screen and (min-width:2190px){.markdown-article-toc-toggling-button{font-size:28px}}@media screen and (min-width:2879px){.markdown-article-toc-toggling-button{font-size:40px}}@media screen and (max-width:600px){.markdown-article-toc-toggling-button{font-size:16px}}@media screen{body.markdown-article-toc-exists.markdown-article-toc-is-visible{margin-left:35em}nav.markdown-article-toc{display:none}.markdown-article-toc-is-visible nav.markdown-article-toc{display:flex}.markdown-article-toc-toggling-button{align-items:center;border:1px solid transparent;border-radius:0 515px 515px 0;box-sizing:content-box;cursor:pointer;display:flex;flex-direction:row;height:1.25em;justify-content:center;left:-.5em;line-height:1.25;padding-bottom:.15em;padding-right:.75em;padding-top:.15em;position:fixed;text-align:center;top:1em;transform:translateX(0);transition:all .3s;user-select:none;white-space:nowrap;width:3em}.markdown-article-toc-toggling-button:active,.markdown-article-toc-toggling-button:focus{outline:none}.markdown-article-toc-is-visible .markdown-article-toc-toggling-button{border-bottom-left-radius:515px;border-top-left-radius:515px;left:14em;transform:translateX(-50%)}.markdown-article-toc-toggling-button:before{font-family:inherit;font-size:.8em;font-weight:bolder}.markdown-article-toc-toggling-button{padding-left:.83em}.markdown-article-toc-toggling-button:before{content:"TOC";letter-spacing:.1em}[lang*=-CN i] .markdown-article-toc-toggling-button,[lang*=-CN] .markdown-article-toc-toggling-button,[lang*=-hans i] .markdown-article-toc-toggling-button,[lang*=-hans] .markdown-article-toc-toggling-button,[lang*=zh- i] .markdown-article-toc-toggling-button,[lang*=zh-] .markdown-article-toc-toggling-button{padding-left:1.35em}[lang*=-CN i] .markdown-article-toc-toggling-button:before,[lang*=-CN] .markdown-article-toc-toggling-button:before,[lang*=-hans i] .markdown-article-toc-toggling-button:before,[lang*=-hans] .markdown-article-toc-toggling-button:before,[lang*=zh- i] .markdown-article-toc-toggling-button:before,[lang*=zh-] .markdown-article-toc-toggling-button:before{letter-spacing:.75em}[lang*=-CN i] .markdown-article-toc-toggling-button:before,[lang*=-CN] .markdown-article-toc-toggling-button:before,[lang*=-hans i] .markdown-article-toc-toggling-button:before,[lang*=-hans] .markdown-article-toc-toggling-button:before,[lang*=zh- i] .markdown-article-toc-toggling-button:before,[lang*=zh-] .markdown-article-toc-toggling-button:before{content:"目录"}}@media screen and (min-width:1001px){nav.markdown-article-toc li.is-collapsed>ol,nav.markdown-article-toc li.is-collapsed>ul{display:none}}@media screen and (min-width:2190px){body.markdown-article-toc-exists.markdown-article-toc-is-visible{margin-left:49em}}@media screen and (min-width:2879px){body.markdown-article-toc-exists.markdown-article-toc-is-visible{margin-left:70em}}@media screen and (max-width:1400px) and (min-width:1001px){body.markdown-article-toc-exists.markdown-article-toc-is-visible{margin-left:27.5em}nav.markdown-article-toc{width:22em}.markdown-article-toc-is-visible .markdown-article-toc-toggling-button{left:11em}}@media screen and (max-width:1000px){body.markdown-article-toc-exists.markdown-article-toc-is-visible{margin-left:0}nav.markdown-article-toc{width:28em}.markdown-article-toc-is-visible .markdown-article-toc-toggling-button{left:14em}}@media screen and (max-width:600px){body.markdown-article-toc-exists.markdown-article-toc-is-visible{margin-left:0}nav.markdown-article-toc{animation-delay:0s;animation-duration:.219s;animation-fill-mode:both;animation-name:wlc-animation__toc_panel_slides_in;animation-timing-function:ease-out;width:100%}@-moz-keyframes wlc-animation__toc_panel_slides_in{0%{transform:translateX(-101%)}to{transform:none}}@-webkit-keyframes wlc-animation__toc_panel_slides_in{0%{transform:translateX(-101%)}to{transform:none}}@-o-keyframes wlc-animation__toc_panel_slides_in{0%{transform:translateX(-101%)}to{transform:none}}@keyframes wlc-animation__toc_panel_slides_in{0%{transform:translateX(-101%)}to{transform:none}}.markdown-article-toc-is-visible .markdown-article-toc-toggling-button,.markdown-article-toc-toggling-button{border-bottom-left-radius:0;border-top-left-radius:0;font-size:.8em;left:-1em;padding-left:1.5em;top:1.33em;transform:translateX(0)}[lang*=-CN i] .markdown-article-toc-is-visible .markdown-article-toc-toggling-button,[lang*=-CN i] .markdown-article-toc-toggling-button,[lang*=-CN] .markdown-article-toc-is-visible .markdown-article-toc-toggling-button,[lang*=-CN] .markdown-article-toc-toggling-button,[lang*=-hans i] .markdown-article-toc-is-visible .markdown-article-toc-toggling-button,[lang*=-hans i] .markdown-article-toc-toggling-button,[lang*=-hans] .markdown-article-toc-is-visible .markdown-article-toc-toggling-button,[lang*=-hans] .markdown-article-toc-toggling-button,[lang*=zh- i] .markdown-article-toc-is-visible .markdown-article-toc-toggling-button,[lang*=zh- i] .markdown-article-toc-toggling-button,[lang*=zh-] .markdown-article-toc-is-visible .markdown-article-toc-toggling-button,[lang*=zh-] .markdown-article-toc-toggling-button{padding-left:2em}}@media print{.markdown-article-toc-is-visible nav.markdown-article-toc,.markdown-article-toc-toggling-button,nav.markdown-article-toc{display:none}}.markdown-article,button,input,option,select,textarea{font-family:serif}code{font-family:inherit}kbd,pre>code{font-family:monospace,serif}html{background-color:#0d0d0d}body{scrollbar-color:hsla(0,0%,80%,.75) hsla(0,0%,80%,.15);scrollbar-width:thin}body::-webkit-scrollbar{border-radius:0;height:1.125em;width:1.125em}body::-webkit-scrollbar:hover{background-color:hsla(0,0%,80%,.15)}body::-webkit-resizer,body::-webkit-scrollbar-button,body::-webkit-scrollbar-corner,body::-webkit-scrollbar-thumb,body::-webkit-scrollbar-track,body::-webkit-scrollbar-track-piece{background-clip:content-box;border-color:transparent;border-radius:1.5em;border-style:solid}body::-webkit-scrollbar-button{display:none}body::-webkit-scrollbar-thumb{background-color:hsla(0,0%,80%,.45);border-width:.45em}body::-webkit-scrollbar-thumb:hover{background-color:#ccc}body::-webkit-scrollbar-track{background-color:hsla(0,0%,80%,.1);border-width:.3em;box-shadow:inset 0 0 0 .075em hsla(0,0%,80%,.1)}body::-webkit-scrollbar-track:hover{box-shadow:inset 0 0 0 .075em hsla(0,0%,80%,.515)}body::-webkit-scrollbar-corner,body::-webkit-scrollbar-track-piece{display:none}body{background-color:transparent}h1,h2,h3{font-weight:400}h4{font-weight:500}h5,h6{font-weight:600}p{font-weight:400}em,strong{font-weight:500}h1 em,h1 strong,h2 em,h2 strong,h3 em,h3 strong,h4 em,h4 strong,h5 em,h5 strong,h6 em,h6 strong{font-weight:600}dt em,dt strong{font-weight:inherit}b,em strong,strong em{font-weight:600}blockquote,img{border-radius:.3em}blockquote{border-width:0 0 0 .32em}details{border-radius:.36em}summary:active,summary:focus{outline:none}table{border-width:6px}tr{border-width:0}thead tr:last-of-type{border-bottom-width:3px}code,kbd,td,th{border-width:1px}kbd{border-radius:.25em}code{border-radius:.2em}pre{border-radius:.3em}@media (max-width:600px){h1{font-weight:450}}.markdown-article{background-color:#2c2b2a;box-shadow:0 0 .4em rgba(0,0,0,.51);color:#a9a9ab}a,a b,a code,a em,a i,a strong{transition-duration:.3s;transition-property:visibility,opacity,color,border-color,background-color,text-decoration-color,outline-color,border-radius,transform}a{text-decoration-thickness:.1em}a.header-anchor[href^="#"],a.header-anchor[href^="#"]:visited{color:#333}h1:hover>a.header-anchor[href^="#"],h2:hover>a.header-anchor[href^="#"],h3:hover>a.header-anchor[href^="#"],h4:hover>a.header-anchor[href^="#"],h5:hover>a.header-anchor[href^="#"],h6:hover>a.header-anchor[href^="#"]{background-color:hsla(0,0%,100%,.039);color:#7c6}h1>a.header-anchor[href^="#"]:active,h1>a.header-anchor[href^="#"]:focus,h1>a.header-anchor[href^="#"]:hover,h2>a.header-anchor[href^="#"]:active,h2>a.header-anchor[href^="#"]:focus,h2>a.header-anchor[href^="#"]:hover,h3>a.header-anchor[href^="#"]:active,h3>a.header-anchor[href^="#"]:focus,h3>a.header-anchor[href^="#"]:hover,h4>a.header-anchor[href^="#"]:active,h4>a.header-anchor[href^="#"]:focus,h4>a.header-anchor[href^="#"]:hover,h5>a.header-anchor[href^="#"]:active,h5>a.header-anchor[href^="#"]:focus,h5>a.header-anchor[href^="#"]:hover,h6>a.header-anchor[href^="#"]:active,h6>a.header-anchor[href^="#"]:focus,h6>a.header-anchor[href^="#"]:hover{background-color:hsla(0,0%,100%,.075);color:#9e8}img{background-color:rgba(0,0,0,.219);box-shadow:inset 0 0 .5em rgba(0,0,0,.51);color:#555}input[type=checkbox]+label{color:#ddd}input[type=checkbox]:checked+label{color:#aba;text-shadow:-1px -1px 0 rgba(0,128,0,.1)}code{background-color:#151515;border-color:hsla(0,0%,100%,.219);color:#dad;text-shadow:none}b,strong{font-style:normal}em,em>strong,i{font-style:italic}b,i{color:#aaa}strong{background-color:#453927;color:#fd9}strong code{background-color:hsla(0,0%,8%,.6);border-color:rgba(153,136,85,.515);color:#eda}em{background-color:rgba(136,102,170,.333);color:#d1b2e3}em code{background-color:hsla(0,0%,8%,.6);border-color:rgba(170,136,187,.515);color:#dbe}a em s,a em s code,a s,a s code,a s em,a s em code,a s strong,a s strong code,a strong s,a strong s code,em a s,em a s code,em s,em s a,em s a code,em s code,s,s a,s a code,s a em,s a em code,s a strong,s a strong code,s code,s em,s em a,s em a code,s em code,s strong,s strong a,s strong a code,s strong code,strong a s,strong a s code,strong s,strong s a,strong s a code,strong s code{color:#a66;text-decoration-color:#de4545;text-decoration-style:solid;text-decoration-thickness:.1em}a em s code,a s code,a s em code,a s strong code,a strong s code,em a s code,em s a code,em s code,s a code,s a em code,s a strong code,s code,s em a code,s em code,s strong a code,s strong code,strong a s code,strong s a code,strong s code{background-color:hsla(0,0%,8%,.4);border-color:hsla(0,38%,57%,.15)}em strong,strong em{color:#ecc}em strong code,strong em code{color:#fdd}em strong,strong em{background-color:rgba(85,0,0,.533)}em strong code,strong em code{background-color:hsla(0,0%,8%,.6);border-color:hsla(0,38%,57%,.515)}em s strong,em s strong code,em strong s,em strong s code,s em strong,s em strong code,s strong em,s strong em code,strong em s,strong em s code,strong s em,strong s em code{color:#866;text-decoration-style:solid}em s strong code,em strong s code,s em strong code,s strong em code,strong em s code,strong s em code{background-color:rgba(68,68,68,.8);border-color:hsla(0,60%,67%,.2)}a,a em s,a em s code,a s,a s code,a s em,a s em code,a s strong,a s strong code,a strong s,a strong s code,a:visited,em a s,em a s code,em s a,em s a code,s a,s a code,s a em,s a em code,s a strong,s a strong code,s em a,s em a code,s strong a,s strong a code,strong a s,strong a s code,strong s a,strong s a code{color:#3bc}a em s code,a s code,a s em code,a s strong code,a strong s code,em a s code,em s a code,s a code,s a em code,s a strong code,s em a code,s strong a code,strong a s code,strong s a code{border-color:hsla(0,0%,100%,.219)}a em strong,a em strong code,a strong em,a strong em code,em a strong,em a strong code,em strong a,em strong a code,strong a em,strong a em code,strong em a,strong em a code{color:#fee}a em strong code,a strong em code,em a strong code,em strong a code,strong a em code,strong em a code{border-color:#855}a em s strong,a em s strong code,a em strong s,a em strong s code,a s em strong,a s em strong code,a s strong em,a s strong em code,a strong em s,a strong em s code,a strong s em,a strong s em code,em a s strong,em a s strong code,em a strong s,em a strong s code,em s a strong,em s a strong code,em s strong a,em s strong a code,em strong a s,em strong a s code,em strong s a,em strong s a code,s a em strong,s a em strong code,s a strong em,s a strong em code,s em a strong,s em a strong code,s em strong a,s em strong a code,s strong a em,s strong a em code,s strong em a,s strong em a code,strong a em s,strong a em s code,strong a s em,strong a s em code,strong em a s,strong em a s code,strong em s a,strong em s a code,strong s a em,strong s a em code,strong s em a,strong s em a code{color:#e3a3c3}a:hover,a:hover code{color:#5df}a:hover{background-color:transparent}a:hover code{background-color:#000;border-color:currentColor;text-decoration-color:currentColor}a:hover em,a:hover em code,a:hover strong,a:hover strong code,em a:hover,em a:hover code,strong a:hover,strong a:hover code{color:#5df}a:hover em,a:hover strong,em a:hover,strong a:hover{background-color:transparent}a:hover em code,a:hover strong code,em a:hover code,strong a:hover code{background-color:#000;border-color:currentColor;text-decoration-color:currentColor}a:hover em s,a:hover em s code,a:hover s,a:hover s code,a:hover s em,a:hover s em code,a:hover s strong,a:hover s strong code,a:hover strong s,a:hover strong s code,em a:hover s,em a:hover s code,em s a:hover,em s a:hover code,s a:hover,s a:hover code,s a:hover em,s a:hover em code,s a:hover strong,s a:hover strong code,s em a:hover,s em a:hover code,s strong a:hover,s strong a:hover code,strong a:hover s,strong a:hover s code,strong s a:hover,strong s a:hover code{color:#5df}a:hover em s,a:hover s,a:hover s em,a:hover s strong,a:hover strong s,em a:hover s,em s a:hover,s a:hover,s a:hover em,s a:hover strong,s em a:hover,s strong a:hover,strong a:hover s,strong s a:hover{background-color:transparent}a:hover em s code,a:hover s code,a:hover s em code,a:hover s strong code,a:hover strong s code,em a:hover s code,em s a:hover code,s a:hover code,s a:hover em code,s a:hover strong code,s em a:hover code,s strong a:hover code,strong a:hover s code,strong s a:hover code{background-color:#000;border-color:currentColor;text-decoration-color:currentColor}a:hover em strong,a:hover em strong code,a:hover strong em,a:hover strong em code,em a:hover strong,em a:hover strong code,em strong a:hover,em strong a:hover code,strong a:hover em,strong a:hover em code,strong em a:hover,strong em a:hover code{color:#5df}a:hover em strong,a:hover strong em,em a:hover strong,em strong a:hover,strong a:hover em,strong em a:hover{background-color:transparent}a:hover em strong code,a:hover strong em code,em a:hover strong code,em strong a:hover code,strong a:hover em code,strong em a:hover code{background-color:#000;border-color:currentColor;text-decoration-color:currentColor}a:hover em s strong,a:hover em s strong code,a:hover em strong s,a:hover em strong s code,a:hover s em strong,a:hover s em strong code,a:hover s strong em,a:hover s strong em code,a:hover strong em s,a:hover strong em s code,a:hover strong s em,a:hover strong s em code,em a:hover s strong,em a:hover s strong code,em a:hover strong s,em a:hover strong s code,em s a:hover strong,em s a:hover strong code,em s strong a:hover,em s strong a:hover code,em strong a:hover s,em strong a:hover s code,em strong s a:hover,em strong s a:hover code,s a:hover em strong,s a:hover em strong code,s a:hover strong em,s a:hover strong em code,s em a:hover strong,s em a:hover strong code,s em strong a:hover,s em strong a:hover code,s strong a:hover em,s strong a:hover em code,s strong em a:hover,s strong em a:hover code,strong a:hover em s,strong a:hover em s code,strong a:hover s em,strong a:hover s em code,strong em a:hover s,strong em a:hover s code,strong em s a:hover,strong em s a:hover code,strong s a:hover em,strong s a:hover em code,strong s em a:hover,strong s em a:hover code{color:#5df}a:hover em s strong,a:hover em strong s,a:hover s em strong,a:hover s strong em,a:hover strong em s,a:hover strong s em,em a:hover s strong,em a:hover strong s,em s a:hover strong,em s strong a:hover,em strong a:hover s,em strong s a:hover,s a:hover em strong,s a:hover strong em,s em a:hover strong,s em strong a:hover,s strong a:hover em,s strong em a:hover,strong a:hover em s,strong a:hover s em,strong em a:hover s,strong em s a:hover,strong s a:hover em,strong s em a:hover{background-color:transparent}a:hover em s strong code,a:hover em strong s code,a:hover s em strong code,a:hover s strong em code,a:hover strong em s code,a:hover strong s em code,em a:hover s strong code,em a:hover strong s code,em s a:hover strong code,em s strong a:hover code,em strong a:hover s code,em strong s a:hover code,s a:hover em strong code,s a:hover strong em code,s em a:hover strong code,s em strong a:hover code,s strong a:hover em code,s strong em a:hover code,strong a:hover em s code,strong a:hover s em code,strong em a:hover s code,strong em s a:hover code,strong s a:hover em code,strong s em a:hover code{background-color:#000;border-color:currentColor;text-decoration-color:currentColor}a:active,a:active code{color:#5df}a:active{background-color:transparent}a:active code{background-color:#000;border-color:currentColor;text-decoration-color:currentColor}a:active em,a:active em code,a:active strong,a:active strong code,em a:active,em a:active code,strong a:active,strong a:active code{color:#5df}a:active em,a:active strong,em a:active,strong a:active{background-color:transparent}a:active em code,a:active strong code,em a:active code,strong a:active code{background-color:#000;border-color:currentColor;text-decoration-color:currentColor}a:active em s,a:active em s code,a:active s,a:active s code,a:active s em,a:active s em code,a:active s strong,a:active s strong code,a:active strong s,a:active strong s code,em a:active s,em a:active s code,em s a:active,em s a:active code,s a:active,s a:active code,s a:active em,s a:active em code,s a:active strong,s a:active strong code,s em a:active,s em a:active code,s strong a:active,s strong a:active code,strong a:active s,strong a:active s code,strong s a:active,strong s a:active code{color:#5df}a:active em s,a:active s,a:active s em,a:active s strong,a:active strong s,em a:active s,em s a:active,s a:active,s a:active em,s a:active strong,s em a:active,s strong a:active,strong a:active s,strong s a:active{background-color:transparent}a:active em s code,a:active s code,a:active s em code,a:active s strong code,a:active strong s code,em a:active s code,em s a:active code,s a:active code,s a:active em code,s a:active strong code,s em a:active code,s strong a:active code,strong a:active s code,strong s a:active code{background-color:#000;border-color:currentColor;text-decoration-color:currentColor}a:active em strong,a:active em strong code,a:active strong em,a:active strong em code,em a:active strong,em a:active strong code,em strong a:active,em strong a:active code,strong a:active em,strong a:active em code,strong em a:active,strong em a:active code{color:#5df}a:active em strong,a:active strong em,em a:active strong,em strong a:active,strong a:active em,strong em a:active{background-color:transparent}a:active em strong code,a:active strong em code,em a:active strong code,em strong a:active code,strong a:active em code,strong em a:active code{background-color:#000;border-color:currentColor;text-decoration-color:currentColor}a:active em s strong,a:active em s strong code,a:active em strong s,a:active em strong s code,a:active s em strong,a:active s em strong code,a:active s strong em,a:active s strong em code,a:active strong em s,a:active strong em s code,a:active strong s em,a:active strong s em code,em a:active s strong,em a:active s strong code,em a:active strong s,em a:active strong s code,em s a:active strong,em s a:active strong code,em s strong a:active,em s strong a:active code,em strong a:active s,em strong a:active s code,em strong s a:active,em strong s a:active code,s a:active em strong,s a:active em strong code,s a:active strong em,s a:active strong em code,s em a:active strong,s em a:active strong code,s em strong a:active,s em strong a:active code,s strong a:active em,s strong a:active em code,s strong em a:active,s strong em a:active code,strong a:active em s,strong a:active em s code,strong a:active s em,strong a:active s em code,strong em a:active s,strong em a:active s code,strong em s a:active,strong em s a:active code,strong s a:active em,strong s a:active em code,strong s em a:active,strong s em a:active code{color:#5df}a:active em s strong,a:active em strong s,a:active s em strong,a:active s strong em,a:active strong em s,a:active strong s em,em a:active s strong,em a:active strong s,em s a:active strong,em s strong a:active,em strong a:active s,em strong s a:active,s a:active em strong,s a:active strong em,s em a:active strong,s em strong a:active,s strong a:active em,s strong em a:active,strong a:active em s,strong a:active s em,strong em a:active s,strong em s a:active,strong s a:active em,strong s em a:active{background-color:transparent}a:active em s strong code,a:active em strong s code,a:active s em strong code,a:active s strong em code,a:active strong em s code,a:active strong s em code,em a:active s strong code,em a:active strong s code,em s a:active strong code,em s strong a:active code,em strong a:active s code,em strong s a:active code,s a:active em strong code,s a:active strong em code,s em a:active strong code,s em strong a:active code,s strong a:active em code,s strong em a:active code,strong a:active em s code,strong a:active s em code,strong em a:active s code,strong em s a:active code,strong s a:active em code,strong s em a:active code{background-color:#000;border-color:currentColor;text-decoration-color:currentColor}a:focus,a:focus code{color:#5df}a:focus{background-color:transparent}a:focus code{background-color:#000;border-color:currentColor;text-decoration-color:currentColor}a:focus em,a:focus em code,a:focus strong,a:focus strong code,em a:focus,em a:focus code,strong a:focus,strong a:focus code{color:#5df}a:focus em,a:focus strong,em a:focus,strong a:focus{background-color:transparent}a:focus em code,a:focus strong code,em a:focus code,strong a:focus code{background-color:#000;border-color:currentColor;text-decoration-color:currentColor}a:focus em s,a:focus em s code,a:focus s,a:focus s code,a:focus s em,a:focus s em code,a:focus s strong,a:focus s strong code,a:focus strong s,a:focus strong s code,em a:focus s,em a:focus s code,em s a:focus,em s a:focus code,s a:focus,s a:focus code,s a:focus em,s a:focus em code,s a:focus strong,s a:focus strong code,s em a:focus,s em a:focus code,s strong a:focus,s strong a:focus code,strong a:focus s,strong a:focus s code,strong s a:focus,strong s a:focus code{color:#5df}a:focus em s,a:focus s,a:focus s em,a:focus s strong,a:focus strong s,em a:focus s,em s a:focus,s a:focus,s a:focus em,s a:focus strong,s em a:focus,s strong a:focus,strong a:focus s,strong s a:focus{background-color:transparent}a:focus em s code,a:focus s code,a:focus s em code,a:focus s strong code,a:focus strong s code,em a:focus s code,em s a:focus code,s a:focus code,s a:focus em code,s a:focus strong code,s em a:focus code,s strong a:focus code,strong a:focus s code,strong s a:focus code{background-color:#000;border-color:currentColor;text-decoration-color:currentColor}a:focus em strong,a:focus em strong code,a:focus strong em,a:focus strong em code,em a:focus strong,em a:focus strong code,em strong a:focus,em strong a:focus code,strong a:focus em,strong a:focus em code,strong em a:focus,strong em a:focus code{color:#5df}a:focus em strong,a:focus strong em,em a:focus strong,em strong a:focus,strong a:focus em,strong em a:focus{background-color:transparent}a:focus em strong code,a:focus strong em code,em a:focus strong code,em strong a:focus code,strong a:focus em code,strong em a:focus code{background-color:#000;border-color:currentColor;text-decoration-color:currentColor}a:focus em s strong,a:focus em s strong code,a:focus em strong s,a:focus em strong s code,a:focus s em strong,a:focus s em strong code,a:focus s strong em,a:focus s strong em code,a:focus strong em s,a:focus strong em s code,a:focus strong s em,a:focus strong s em code,em a:focus s strong,em a:focus s strong code,em a:focus strong s,em a:focus strong s code,em s a:focus strong,em s a:focus strong code,em s strong a:focus,em s strong a:focus code,em strong a:focus s,em strong a:focus s code,em strong s a:focus,em strong s a:focus code,s a:focus em strong,s a:focus em strong code,s a:focus strong em,s a:focus strong em code,s em a:focus strong,s em a:focus strong code,s em strong a:focus,s em strong a:focus code,s strong a:focus em,s strong a:focus em code,s strong em a:focus,s strong em a:focus code,strong a:focus em s,strong a:focus em s code,strong a:focus s em,strong a:focus s em code,strong em a:focus s,strong em a:focus s code,strong em s a:focus,strong em s a:focus code,strong s a:focus em,strong s a:focus em code,strong s em a:focus,strong s em a:focus code{color:#5df}a:focus em s strong,a:focus em strong s,a:focus s em strong,a:focus s strong em,a:focus strong em s,a:focus strong s em,em a:focus s strong,em a:focus strong s,em s a:focus strong,em s strong a:focus,em strong a:focus s,em strong s a:focus,s a:focus em strong,s a:focus strong em,s em a:focus strong,s em strong a:focus,s strong a:focus em,s strong em a:focus,strong a:focus em s,strong a:focus s em,strong em a:focus s,strong em s a:focus,strong s a:focus em,strong s em a:focus{background-color:transparent}a:focus em s strong code,a:focus em strong s code,a:focus s em strong code,a:focus s strong em code,a:focus strong em s code,a:focus strong s em code,em a:focus s strong code,em a:focus strong s code,em s a:focus strong code,em s strong a:focus code,em strong a:focus s code,em strong s a:focus code,s a:focus em strong code,s a:focus strong em code,s em a:focus strong code,s em strong a:focus code,s strong a:focus em code,s strong em a:focus code,strong a:focus em s code,strong a:focus s em code,strong em a:focus s code,strong em s a:focus code,strong s a:focus em code,strong s em a:focus code{background-color:#000;border-color:currentColor;text-decoration-color:currentColor}a[href^="#"],a[href^="#"] em s,a[href^="#"] em s code,a[href^="#"] s,a[href^="#"] s code,a[href^="#"] s em,a[href^="#"] s em code,a[href^="#"] s strong,a[href^="#"] s strong code,a[href^="#"] strong s,a[href^="#"] strong s code,a[href^="#"]:visited,em a[href^="#"] s,em a[href^="#"] s code,em s a[href^="#"],em s a[href^="#"] code,s a[href^="#"],s a[href^="#"] code,s a[href^="#"] em,s a[href^="#"] em code,s a[href^="#"] strong,s a[href^="#"] strong code,s em a[href^="#"],s em a[href^="#"] code,s strong a[href^="#"],s strong a[href^="#"] code,strong a[href^="#"] s,strong a[href^="#"] s code,strong s a[href^="#"],strong s a[href^="#"] code{color:#7c6}a[href^="#"] em s code,a[href^="#"] s code,a[href^="#"] s em code,a[href^="#"] s strong code,a[href^="#"] strong s code,em a[href^="#"] s code,em s a[href^="#"] code,s a[href^="#"] code,s a[href^="#"] em code,s a[href^="#"] strong code,s em a[href^="#"] code,s strong a[href^="#"] code,strong a[href^="#"] s code,strong s a[href^="#"] code{border-color:hsla(0,0%,100%,.219)}a[href^="#"] em strong,a[href^="#"] em strong code,a[href^="#"] strong em,a[href^="#"] strong em code,em a[href^="#"] strong,em a[href^="#"] strong code,em strong a[href^="#"],em strong a[href^="#"] code,strong a[href^="#"] em,strong a[href^="#"] em code,strong em a[href^="#"],strong em a[href^="#"] code{color:#fdd}a[href^="#"] em strong code,a[href^="#"] strong em code,em a[href^="#"] strong code,em strong a[href^="#"] code,strong a[href^="#"] em code,strong em a[href^="#"] code{border-color:#855}a[href^="#"] em s strong,a[href^="#"] em s strong code,a[href^="#"] em strong s,a[href^="#"] em strong s code,a[href^="#"] s em strong,a[href^="#"] s em strong code,a[href^="#"] s strong em,a[href^="#"] s strong em code,a[href^="#"] strong em s,a[href^="#"] strong em s code,a[href^="#"] strong s em,a[href^="#"] strong s em code,em a[href^="#"] s strong,em a[href^="#"] s strong code,em a[href^="#"] strong s,em a[href^="#"] strong s code,em s a[href^="#"] strong,em s a[href^="#"] strong code,em s strong a[href^="#"],em s strong a[href^="#"] code,em strong a[href^="#"] s,em strong a[href^="#"] s code,em strong s a[href^="#"],em strong s a[href^="#"] code,s a[href^="#"] em strong,s a[href^="#"] em strong code,s a[href^="#"] strong em,s a[href^="#"] strong em code,s em a[href^="#"] strong,s em a[href^="#"] strong code,s em strong a[href^="#"],s em strong a[href^="#"] code,s strong a[href^="#"] em,s strong a[href^="#"] em code,s strong em a[href^="#"],s strong em a[href^="#"] code,strong a[href^="#"] em s,strong a[href^="#"] em s code,strong a[href^="#"] s em,strong a[href^="#"] s em code,strong em a[href^="#"] s,strong em a[href^="#"] s code,strong em s a[href^="#"],strong em s a[href^="#"] code,strong s a[href^="#"] em,strong s a[href^="#"] em code,strong s em a[href^="#"],strong s em a[href^="#"] code{color:#f66}a[href^="#"]:hover,a[href^="#"]:hover code{color:#9e8}a[href^="#"]:hover{background-color:transparent}a[href^="#"]:hover code{background-color:#000;border-color:currentColor;text-decoration-color:currentColor}a[href^="#"]:hover em,a[href^="#"]:hover em code,a[href^="#"]:hover strong,a[href^="#"]:hover strong code,em a[href^="#"]:hover,em a[href^="#"]:hover code,strong a[href^="#"]:hover,strong a[href^="#"]:hover code{color:#9e8}a[href^="#"]:hover em,a[href^="#"]:hover strong,em a[href^="#"]:hover,strong a[href^="#"]:hover{background-color:transparent}a[href^="#"]:hover em code,a[href^="#"]:hover strong code,em a[href^="#"]:hover code,strong a[href^="#"]:hover code{background-color:#000;border-color:currentColor;text-decoration-color:currentColor}a[href^="#"]:hover em s,a[href^="#"]:hover em s code,a[href^="#"]:hover s,a[href^="#"]:hover s code,a[href^="#"]:hover s em,a[href^="#"]:hover s em code,a[href^="#"]:hover s strong,a[href^="#"]:hover s strong code,a[href^="#"]:hover strong s,a[href^="#"]:hover strong s code,em a[href^="#"]:hover s,em a[href^="#"]:hover s code,em s a[href^="#"]:hover,em s a[href^="#"]:hover code,s a[href^="#"]:hover,s a[href^="#"]:hover code,s a[href^="#"]:hover em,s a[href^="#"]:hover em code,s a[href^="#"]:hover strong,s a[href^="#"]:hover strong code,s em a[href^="#"]:hover,s em a[href^="#"]:hover code,s strong a[href^="#"]:hover,s strong a[href^="#"]:hover code,strong a[href^="#"]:hover s,strong a[href^="#"]:hover s code,strong s a[href^="#"]:hover,strong s a[href^="#"]:hover code{color:#9e8}a[href^="#"]:hover em s,a[href^="#"]:hover s,a[href^="#"]:hover s em,a[href^="#"]:hover s strong,a[href^="#"]:hover strong s,em a[href^="#"]:hover s,em s a[href^="#"]:hover,s a[href^="#"]:hover,s a[href^="#"]:hover em,s a[href^="#"]:hover strong,s em a[href^="#"]:hover,s strong a[href^="#"]:hover,strong a[href^="#"]:hover s,strong s a[href^="#"]:hover{background-color:transparent}a[href^="#"]:hover em s code,a[href^="#"]:hover s code,a[href^="#"]:hover s em code,a[href^="#"]:hover s strong code,a[href^="#"]:hover strong s code,em a[href^="#"]:hover s code,em s a[href^="#"]:hover code,s a[href^="#"]:hover code,s a[href^="#"]:hover em code,s a[href^="#"]:hover strong code,s em a[href^="#"]:hover code,s strong a[href^="#"]:hover code,strong a[href^="#"]:hover s code,strong s a[href^="#"]:hover code{background-color:#000;border-color:currentColor;text-decoration-color:currentColor}a[href^="#"]:hover em strong,a[href^="#"]:hover em strong code,a[href^="#"]:hover strong em,a[href^="#"]:hover strong em code,em a[href^="#"]:hover strong,em a[href^="#"]:hover strong code,em strong a[href^="#"]:hover,em strong a[href^="#"]:hover code,strong a[href^="#"]:hover em,strong a[href^="#"]:hover em code,strong em a[href^="#"]:hover,strong em a[href^="#"]:hover code{color:#9e8}a[href^="#"]:hover em strong,a[href^="#"]:hover strong em,em a[href^="#"]:hover strong,em strong a[href^="#"]:hover,strong a[href^="#"]:hover em,strong em a[href^="#"]:hover{background-color:transparent}a[href^="#"]:hover em strong code,a[href^="#"]:hover strong em code,em a[href^="#"]:hover strong code,em strong a[href^="#"]:hover code,strong a[href^="#"]:hover em code,strong em a[href^="#"]:hover code{background-color:#000;border-color:currentColor;text-decoration-color:currentColor}a[href^="#"]:hover em s strong,a[href^="#"]:hover em s strong code,a[href^="#"]:hover em strong s,a[href^="#"]:hover em strong s code,a[href^="#"]:hover s em strong,a[href^="#"]:hover s em strong code,a[href^="#"]:hover s strong em,a[href^="#"]:hover s strong em code,a[href^="#"]:hover strong em s,a[href^="#"]:hover strong em s code,a[href^="#"]:hover strong s em,a[href^="#"]:hover strong s em code,em a[href^="#"]:hover s strong,em a[href^="#"]:hover s strong code,em a[href^="#"]:hover strong s,em a[href^="#"]:hover strong s code,em s a[href^="#"]:hover strong,em s a[href^="#"]:hover strong code,em s strong a[href^="#"]:hover,em s strong a[href^="#"]:hover code,em strong a[href^="#"]:hover s,em strong a[href^="#"]:hover s code,em strong s a[href^="#"]:hover,em strong s a[href^="#"]:hover code,s a[href^="#"]:hover em strong,s a[href^="#"]:hover em strong code,s a[href^="#"]:hover strong em,s a[href^="#"]:hover strong em code,s em a[href^="#"]:hover strong,s em a[href^="#"]:hover strong code,s em strong a[href^="#"]:hover,s em strong a[href^="#"]:hover code,s strong a[href^="#"]:hover em,s strong a[href^="#"]:hover em code,s strong em a[href^="#"]:hover,s strong em a[href^="#"]:hover code,strong a[href^="#"]:hover em s,strong a[href^="#"]:hover em s code,strong a[href^="#"]:hover s em,strong a[href^="#"]:hover s em code,strong em a[href^="#"]:hover s,strong em a[href^="#"]:hover s code,strong em s a[href^="#"]:hover,strong em s a[href^="#"]:hover code,strong s a[href^="#"]:hover em,strong s a[href^="#"]:hover em code,strong s em a[href^="#"]:hover,strong s em a[href^="#"]:hover code{color:#9e8}a[href^="#"]:hover em s strong,a[href^="#"]:hover em strong s,a[href^="#"]:hover s em strong,a[href^="#"]:hover s strong em,a[href^="#"]:hover strong em s,a[href^="#"]:hover strong s em,em a[href^="#"]:hover s strong,em a[href^="#"]:hover strong s,em s a[href^="#"]:hover strong,em s strong a[href^="#"]:hover,em strong a[href^="#"]:hover s,em strong s a[href^="#"]:hover,s a[href^="#"]:hover em strong,s a[href^="#"]:hover strong em,s em a[href^="#"]:hover strong,s em strong a[href^="#"]:hover,s strong a[href^="#"]:hover em,s strong em a[href^="#"]:hover,strong a[href^="#"]:hover em s,strong a[href^="#"]:hover s em,strong em a[href^="#"]:hover s,strong em s a[href^="#"]:hover,strong s a[href^="#"]:hover em,strong s em a[href^="#"]:hover{background-color:transparent}a[href^="#"]:hover em s strong code,a[href^="#"]:hover em strong s code,a[href^="#"]:hover s em strong code,a[href^="#"]:hover s strong em code,a[href^="#"]:hover strong em s code,a[href^="#"]:hover strong s em code,em a[href^="#"]:hover s strong code,em a[href^="#"]:hover strong s code,em s a[href^="#"]:hover strong code,em s strong a[href^="#"]:hover code,em strong a[href^="#"]:hover s code,em strong s a[href^="#"]:hover code,s a[href^="#"]:hover em strong code,s a[href^="#"]:hover strong em code,s em a[href^="#"]:hover strong code,s em strong a[href^="#"]:hover code,s strong a[href^="#"]:hover em code,s strong em a[href^="#"]:hover code,strong a[href^="#"]:hover em s code,strong a[href^="#"]:hover s em code,strong em a[href^="#"]:hover s code,strong em s a[href^="#"]:hover code,strong s a[href^="#"]:hover em code,strong s em a[href^="#"]:hover code{background-color:#000;border-color:currentColor;text-decoration-color:currentColor}a[href^="#"]:active,a[href^="#"]:active code{color:#9e8}a[href^="#"]:active{background-color:transparent}a[href^="#"]:active code{background-color:#000;border-color:currentColor;text-decoration-color:currentColor}a[href^="#"]:active em,a[href^="#"]:active em code,a[href^="#"]:active strong,a[href^="#"]:active strong code,em a[href^="#"]:active,em a[href^="#"]:active code,strong a[href^="#"]:active,strong a[href^="#"]:active code{color:#9e8}a[href^="#"]:active em,a[href^="#"]:active strong,em a[href^="#"]:active,strong a[href^="#"]:active{background-color:transparent}a[href^="#"]:active em code,a[href^="#"]:active strong code,em a[href^="#"]:active code,strong a[href^="#"]:active code{background-color:#000;border-color:currentColor;text-decoration-color:currentColor}a[href^="#"]:active em s,a[href^="#"]:active em s code,a[href^="#"]:active s,a[href^="#"]:active s code,a[href^="#"]:active s em,a[href^="#"]:active s em code,a[href^="#"]:active s strong,a[href^="#"]:active s strong code,a[href^="#"]:active strong s,a[href^="#"]:active strong s code,em a[href^="#"]:active s,em a[href^="#"]:active s code,em s a[href^="#"]:active,em s a[href^="#"]:active code,s a[href^="#"]:active,s a[href^="#"]:active code,s a[href^="#"]:active em,s a[href^="#"]:active em code,s a[href^="#"]:active strong,s a[href^="#"]:active strong code,s em a[href^="#"]:active,s em a[href^="#"]:active code,s strong a[href^="#"]:active,s strong a[href^="#"]:active code,strong a[href^="#"]:active s,strong a[href^="#"]:active s code,strong s a[href^="#"]:active,strong s a[href^="#"]:active code{color:#9e8}a[href^="#"]:active em s,a[href^="#"]:active s,a[href^="#"]:active s em,a[href^="#"]:active s strong,a[href^="#"]:active strong s,em a[href^="#"]:active s,em s a[href^="#"]:active,s a[href^="#"]:active,s a[href^="#"]:active em,s a[href^="#"]:active strong,s em a[href^="#"]:active,s strong a[href^="#"]:active,strong a[href^="#"]:active s,strong s a[href^="#"]:active{background-color:transparent}a[href^="#"]:active em s code,a[href^="#"]:active s code,a[href^="#"]:active s em code,a[href^="#"]:active s strong code,a[href^="#"]:active strong s code,em a[href^="#"]:active s code,em s a[href^="#"]:active code,s a[href^="#"]:active code,s a[href^="#"]:active em code,s a[href^="#"]:active strong code,s em a[href^="#"]:active code,s strong a[href^="#"]:active code,strong a[href^="#"]:active s code,strong s a[href^="#"]:active code{background-color:#000;border-color:currentColor;text-decoration-color:currentColor}a[href^="#"]:active em strong,a[href^="#"]:active em strong code,a[href^="#"]:active strong em,a[href^="#"]:active strong em code,em a[href^="#"]:active strong,em a[href^="#"]:active strong code,em strong a[href^="#"]:active,em strong a[href^="#"]:active code,strong a[href^="#"]:active em,strong a[href^="#"]:active em code,strong em a[href^="#"]:active,strong em a[href^="#"]:active code{color:#9e8}a[href^="#"]:active em strong,a[href^="#"]:active strong em,em a[href^="#"]:active strong,em strong a[href^="#"]:active,strong a[href^="#"]:active em,strong em a[href^="#"]:active{background-color:transparent}a[href^="#"]:active em strong code,a[href^="#"]:active strong em code,em a[href^="#"]:active strong code,em strong a[href^="#"]:active code,strong a[href^="#"]:active em code,strong em a[href^="#"]:active code{background-color:#000;border-color:currentColor;text-decoration-color:currentColor}a[href^="#"]:active em s strong,a[href^="#"]:active em s strong code,a[href^="#"]:active em strong s,a[href^="#"]:active em strong s code,a[href^="#"]:active s em strong,a[href^="#"]:active s em strong code,a[href^="#"]:active s strong em,a[href^="#"]:active s strong em code,a[href^="#"]:active strong em s,a[href^="#"]:active strong em s code,a[href^="#"]:active strong s em,a[href^="#"]:active strong s em code,em a[href^="#"]:active s strong,em a[href^="#"]:active s strong code,em a[href^="#"]:active strong s,em a[href^="#"]:active strong s code,em s a[href^="#"]:active strong,em s a[href^="#"]:active strong code,em s strong a[href^="#"]:active,em s strong a[href^="#"]:active code,em strong a[href^="#"]:active s,em strong a[href^="#"]:active s code,em strong s a[href^="#"]:active,em strong s a[href^="#"]:active code,s a[href^="#"]:active em strong,s a[href^="#"]:active em strong code,s a[href^="#"]:active strong em,s a[href^="#"]:active strong em code,s em a[href^="#"]:active strong,s em a[href^="#"]:active strong code,s em strong a[href^="#"]:active,s em strong a[href^="#"]:active code,s strong a[href^="#"]:active em,s strong a[href^="#"]:active em code,s strong em a[href^="#"]:active,s strong em a[href^="#"]:active code,strong a[href^="#"]:active em s,strong a[href^="#"]:active em s code,strong a[href^="#"]:active s em,strong a[href^="#"]:active s em code,strong em a[href^="#"]:active s,strong em a[href^="#"]:active s code,strong em s a[href^="#"]:active,strong em s a[href^="#"]:active code,strong s a[href^="#"]:active em,strong s a[href^="#"]:active em code,strong s em a[href^="#"]:active,strong s em a[href^="#"]:active code{color:#9e8}a[href^="#"]:active em s strong,a[href^="#"]:active em strong s,a[href^="#"]:active s em strong,a[href^="#"]:active s strong em,a[href^="#"]:active strong em s,a[href^="#"]:active strong s em,em a[href^="#"]:active s strong,em a[href^="#"]:active strong s,em s a[href^="#"]:active strong,em s strong a[href^="#"]:active,em strong a[href^="#"]:active s,em strong s a[href^="#"]:active,s a[href^="#"]:active em strong,s a[href^="#"]:active strong em,s em a[href^="#"]:active strong,s em strong a[href^="#"]:active,s strong a[href^="#"]:active em,s strong em a[href^="#"]:active,strong a[href^="#"]:active em s,strong a[href^="#"]:active s em,strong em a[href^="#"]:active s,strong em s a[href^="#"]:active,strong s a[href^="#"]:active em,strong s em a[href^="#"]:active{background-color:transparent}a[href^="#"]:active em s strong code,a[href^="#"]:active em strong s code,a[href^="#"]:active s em strong code,a[href^="#"]:active s strong em code,a[href^="#"]:active strong em s code,a[href^="#"]:active strong s em code,em a[href^="#"]:active s strong code,em a[href^="#"]:active strong s code,em s a[href^="#"]:active strong code,em s strong a[href^="#"]:active code,em strong a[href^="#"]:active s code,em strong s a[href^="#"]:active code,s a[href^="#"]:active em strong code,s a[href^="#"]:active strong em code,s em a[href^="#"]:active strong code,s em strong a[href^="#"]:active code,s strong a[href^="#"]:active em code,s strong em a[href^="#"]:active code,strong a[href^="#"]:active em s code,strong a[href^="#"]:active s em code,strong em a[href^="#"]:active s code,strong em s a[href^="#"]:active code,strong s a[href^="#"]:active em code,strong s em a[href^="#"]:active code{background-color:#000;border-color:currentColor;text-decoration-color:currentColor}a[href^="#"]:focus,a[href^="#"]:focus code{color:#9e8}a[href^="#"]:focus{background-color:transparent}a[href^="#"]:focus code{background-color:#000;border-color:currentColor;text-decoration-color:currentColor}a[href^="#"]:focus em,a[href^="#"]:focus em code,a[href^="#"]:focus strong,a[href^="#"]:focus strong code,em a[href^="#"]:focus,em a[href^="#"]:focus code,strong a[href^="#"]:focus,strong a[href^="#"]:focus code{color:#9e8}a[href^="#"]:focus em,a[href^="#"]:focus strong,em a[href^="#"]:focus,strong a[href^="#"]:focus{background-color:transparent}a[href^="#"]:focus em code,a[href^="#"]:focus strong code,em a[href^="#"]:focus code,strong a[href^="#"]:focus code{background-color:#000;border-color:currentColor;text-decoration-color:currentColor}a[href^="#"]:focus em s,a[href^="#"]:focus em s code,a[href^="#"]:focus s,a[href^="#"]:focus s code,a[href^="#"]:focus s em,a[href^="#"]:focus s em code,a[href^="#"]:focus s strong,a[href^="#"]:focus s strong code,a[href^="#"]:focus strong s,a[href^="#"]:focus strong s code,em a[href^="#"]:focus s,em a[href^="#"]:focus s code,em s a[href^="#"]:focus,em s a[href^="#"]:focus code,s a[href^="#"]:focus,s a[href^="#"]:focus code,s a[href^="#"]:focus em,s a[href^="#"]:focus em code,s a[href^="#"]:focus strong,s a[href^="#"]:focus strong code,s em a[href^="#"]:focus,s em a[href^="#"]:focus code,s strong a[href^="#"]:focus,s strong a[href^="#"]:focus code,strong a[href^="#"]:focus s,strong a[href^="#"]:focus s code,strong s a[href^="#"]:focus,strong s a[href^="#"]:focus code{color:#9e8}a[href^="#"]:focus em s,a[href^="#"]:focus s,a[href^="#"]:focus s em,a[href^="#"]:focus s strong,a[href^="#"]:focus strong s,em a[href^="#"]:focus s,em s a[href^="#"]:focus,s a[href^="#"]:focus,s a[href^="#"]:focus em,s a[href^="#"]:focus strong,s em a[href^="#"]:focus,s strong a[href^="#"]:focus,strong a[href^="#"]:focus s,strong s a[href^="#"]:focus{background-color:transparent}a[href^="#"]:focus em s code,a[href^="#"]:focus s code,a[href^="#"]:focus s em code,a[href^="#"]:focus s strong code,a[href^="#"]:focus strong s code,em a[href^="#"]:focus s code,em s a[href^="#"]:focus code,s a[href^="#"]:focus code,s a[href^="#"]:focus em code,s a[href^="#"]:focus strong code,s em a[href^="#"]:focus code,s strong a[href^="#"]:focus code,strong a[href^="#"]:focus s code,strong s a[href^="#"]:focus code{background-color:#000;border-color:currentColor;text-decoration-color:currentColor}a[href^="#"]:focus em strong,a[href^="#"]:focus em strong code,a[href^="#"]:focus strong em,a[href^="#"]:focus strong em code,em a[href^="#"]:focus strong,em a[href^="#"]:focus strong code,em strong a[href^="#"]:focus,em strong a[href^="#"]:focus code,strong a[href^="#"]:focus em,strong a[href^="#"]:focus em code,strong em a[href^="#"]:focus,strong em a[href^="#"]:focus code{color:#9e8}a[href^="#"]:focus em strong,a[href^="#"]:focus strong em,em a[href^="#"]:focus strong,em strong a[href^="#"]:focus,strong a[href^="#"]:focus em,strong em a[href^="#"]:focus{background-color:transparent}a[href^="#"]:focus em strong code,a[href^="#"]:focus strong em code,em a[href^="#"]:focus strong code,em strong a[href^="#"]:focus code,strong a[href^="#"]:focus em code,strong em a[href^="#"]:focus code{background-color:#000;border-color:currentColor;text-decoration-color:currentColor}a[href^="#"]:focus em s strong,a[href^="#"]:focus em s strong code,a[href^="#"]:focus em strong s,a[href^="#"]:focus em strong s code,a[href^="#"]:focus s em strong,a[href^="#"]:focus s em strong code,a[href^="#"]:focus s strong em,a[href^="#"]:focus s strong em code,a[href^="#"]:focus strong em s,a[href^="#"]:focus strong em s code,a[href^="#"]:focus strong s em,a[href^="#"]:focus strong s em code,em a[href^="#"]:focus s strong,em a[href^="#"]:focus s strong code,em a[href^="#"]:focus strong s,em a[href^="#"]:focus strong s code,em s a[href^="#"]:focus strong,em s a[href^="#"]:focus strong code,em s strong a[href^="#"]:focus,em s strong a[href^="#"]:focus code,em strong a[href^="#"]:focus s,em strong a[href^="#"]:focus s code,em strong s a[href^="#"]:focus,em strong s a[href^="#"]:focus code,s a[href^="#"]:focus em strong,s a[href^="#"]:focus em strong code,s a[href^="#"]:focus strong em,s a[href^="#"]:focus strong em code,s em a[href^="#"]:focus strong,s em a[href^="#"]:focus strong code,s em strong a[href^="#"]:focus,s em strong a[href^="#"]:focus code,s strong a[href^="#"]:focus em,s strong a[href^="#"]:focus em code,s strong em a[href^="#"]:focus,s strong em a[href^="#"]:focus code,strong a[href^="#"]:focus em s,strong a[href^="#"]:focus em s code,strong a[href^="#"]:focus s em,strong a[href^="#"]:focus s em code,strong em a[href^="#"]:focus s,strong em a[href^="#"]:focus s code,strong em s a[href^="#"]:focus,strong em s a[href^="#"]:focus code,strong s a[href^="#"]:focus em,strong s a[href^="#"]:focus em code,strong s em a[href^="#"]:focus,strong s em a[href^="#"]:focus code{color:#9e8}a[href^="#"]:focus em s strong,a[href^="#"]:focus em strong s,a[href^="#"]:focus s em strong,a[href^="#"]:focus s strong em,a[href^="#"]:focus strong em s,a[href^="#"]:focus strong s em,em a[href^="#"]:focus s strong,em a[href^="#"]:focus strong s,em s a[href^="#"]:focus strong,em s strong a[href^="#"]:focus,em strong a[href^="#"]:focus s,em strong s a[href^="#"]:focus,s a[href^="#"]:focus em strong,s a[href^="#"]:focus strong em,s em a[href^="#"]:focus strong,s em strong a[href^="#"]:focus,s strong a[href^="#"]:focus em,s strong em a[href^="#"]:focus,strong a[href^="#"]:focus em s,strong a[href^="#"]:focus s em,strong em a[href^="#"]:focus s,strong em s a[href^="#"]:focus,strong s a[href^="#"]:focus em,strong s em a[href^="#"]:focus{background-color:transparent}a[href^="#"]:focus em s strong code,a[href^="#"]:focus em strong s code,a[href^="#"]:focus s em strong code,a[href^="#"]:focus s strong em code,a[href^="#"]:focus strong em s code,a[href^="#"]:focus strong s em code,em a[href^="#"]:focus s strong code,em a[href^="#"]:focus strong s code,em s a[href^="#"]:focus strong code,em s strong a[href^="#"]:focus code,em strong a[href^="#"]:focus s code,em strong s a[href^="#"]:focus code,s a[href^="#"]:focus em strong code,s a[href^="#"]:focus strong em code,s em a[href^="#"]:focus strong code,s em strong a[href^="#"]:focus code,s strong a[href^="#"]:focus em code,s strong em a[href^="#"]:focus code,strong a[href^="#"]:focus em s code,strong a[href^="#"]:focus s em code,strong em a[href^="#"]:focus s code,strong em s a[href^="#"]:focus code,strong s a[href^="#"]:focus em code,strong s em a[href^="#"]:focus code{background-color:#000;border-color:currentColor;text-decoration-color:currentColor}pre code{background-color:transparent!important}kbd{background-color:#515151;background-image:linear-gradient(100deg,rgba(0,0,0,.086) 3%,hsla(0,0%,100%,.067) 90%),linear-gradient(175deg,rgba(0,0,0,.086) 2%,hsla(0,0%,100%,.067) 79%);border-color:#333 #222 #222 #333;box-shadow:0 .2em 0 .05em #111,inset 0 0 .1em .05em hsla(0,0%,100%,.133);color:#eee;text-shadow:1px 1px 2px rgba(0,0,0,.6)}hr{background-image:linear-gradient(90deg,transparent,currentColor 150%);color:hsla(0,0%,50%,.45)}hr:before{box-shadow:inset 1px 1px 2px 0 rgba(0,0,0,.51)}blockquote{background-color:hsla(0,0%,100%,.079);border-color:#794513;color:#bbb}details{background-color:rgba(0,0,0,.219);box-shadow:inset 0 0 .25em rgba(0,0,0,.515)}summary:active,summary:focus{color:#69e}table{background-color:#3c3c3c;border-color:#000;color:#b4b4b4}thead tr{border-color:#111}th{border-color:#000}td{border-color:#222}thead{background-color:#151515;color:#666}tbody tr:nth-child(odd){background-color:transparent}tbody tr:nth-child(2n){background-color:hsla(0,0%,100%,.032)}@media screen{.markdown-article-back-to-top[href^="#"],.markdown-article-back-to-top[href^="#"]:visited{color:#000}.markdown-article-back-to-top[href^="#"]:before,.markdown-article-back-to-top[href^="#"]:visited:before{background-color:#0f0;background-image:linear-gradient(-45deg,#0ff 15%,#0f0 79%);box-shadow:1px 1px .3em rgba(0,192,0,.6)}}nav.markdown-article-toc{font-family:serif}@media screen{nav.markdown-article-toc{background-color:#000;box-shadow:0 0 .3em rgba(0,0,0,.79);color:#999}nav.markdown-article-toc>ol,nav.markdown-article-toc>ul{scrollbar-color:hsla(0,0%,80%,.75) hsla(0,0%,80%,.15);scrollbar-width:thin}nav.markdown-article-toc>ol::-webkit-scrollbar,nav.markdown-article-toc>ul::-webkit-scrollbar{border-radius:0;height:.9375em;width:.9375em}nav.markdown-article-toc>ol::-webkit-scrollbar:hover,nav.markdown-article-toc>ul::-webkit-scrollbar:hover{background-color:hsla(0,0%,100%,.15)}nav.markdown-article-toc>ol::-webkit-resizer,nav.markdown-article-toc>ol::-webkit-scrollbar-button,nav.markdown-article-toc>ol::-webkit-scrollbar-corner,nav.markdown-article-toc>ol::-webkit-scrollbar-thumb,nav.markdown-article-toc>ol::-webkit-scrollbar-track,nav.markdown-article-toc>ol::-webkit-scrollbar-track-piece,nav.markdown-article-toc>ul::-webkit-resizer,nav.markdown-article-toc>ul::-webkit-scrollbar-button,nav.markdown-article-toc>ul::-webkit-scrollbar-corner,nav.markdown-article-toc>ul::-webkit-scrollbar-thumb,nav.markdown-article-toc>ul::-webkit-scrollbar-track,nav.markdown-article-toc>ul::-webkit-scrollbar-track-piece{background-clip:content-box;border-color:transparent;border-radius:1.25em;border-style:solid}nav.markdown-article-toc>ol::-webkit-scrollbar-button,nav.markdown-article-toc>ul::-webkit-scrollbar-button{display:none}nav.markdown-article-toc>ol::-webkit-scrollbar-thumb,nav.markdown-article-toc>ul::-webkit-scrollbar-thumb{background-color:hsla(0,0%,100%,.45);border-width:.375em}nav.markdown-article-toc>ol::-webkit-scrollbar-thumb:hover,nav.markdown-article-toc>ul::-webkit-scrollbar-thumb:hover{background-color:#fff}nav.markdown-article-toc>ol::-webkit-scrollbar-track,nav.markdown-article-toc>ul::-webkit-scrollbar-track{background-color:hsla(0,0%,100%,.1);border-width:.25em;box-shadow:inset 0 0 0 .0625em hsla(0,0%,100%,.1)}nav.markdown-article-toc>ol::-webkit-scrollbar-track:hover,nav.markdown-article-toc>ul::-webkit-scrollbar-track:hover{box-shadow:inset 0 0 0 .0625em hsla(0,0%,100%,.515)}nav.markdown-article-toc>ol::-webkit-scrollbar-corner,nav.markdown-article-toc>ol::-webkit-scrollbar-track-piece,nav.markdown-article-toc>ul::-webkit-scrollbar-corner,nav.markdown-article-toc>ul::-webkit-scrollbar-track-piece{display:none}nav.markdown-article-toc li:before{color:#444}nav.markdown-article-toc li>a[href^="#"]{border-color:transparent;color:inherit}nav.markdown-article-toc:not(.should-show-2-levels-at-most) li.has-nested-toc-list.is-expanded>a[href^="#"],nav.markdown-article-toc>ol>li.has-nested-toc-list.is-expanded>a[href^="#"],nav.markdown-article-toc>ul>li.has-nested-toc-list.is-expanded>a[href^="#"]{color:#374}nav.markdown-article-toc:not(.should-show-2-levels-at-most) li.has-nested-toc-list>a[href^="#"],nav.markdown-article-toc>ol>li.has-nested-toc-list>a[href^="#"],nav.markdown-article-toc>ul>li.has-nested-toc-list>a[href^="#"]{color:#6d8}nav.markdown-article-toc:not(.should-show-2-levels-at-most) li.has-nested-toc-list>a[href^="#"]:hover,nav.markdown-article-toc>ol>li.has-nested-toc-list>a[href^="#"]:hover,nav.markdown-article-toc>ul>li.has-nested-toc-list>a[href^="#"]:hover{background-color:rgba(221,255,238,.067);color:#6d8}nav.markdown-article-toc li>a[href^="#"]:hover{background-image:linear-gradient(90deg,transparent .25em,hsla(0,0%,100%,.1) 4em,transparent);border-color:hsla(0,0%,100%,.1) transparent}.markdown-article-toc-toggling-button{background-color:#eb52d1;background-image:linear-gradient(23deg,#f1f 19%,#f88 45%,#ffa 87%);border-color:#f03090;box-shadow:0 0 .15em #c93d91;color:#000}}@media screen and (max-width:1000px){nav.markdown-article-toc{background-color:rgba(0,0,0,.96)}@supports (backdrop-filter:blur(20px)) or (-webkit-backdrop-filter:blur(20px)){nav.markdown-article-toc{background-color:rgba(0,0,0,.79)}}@supports (backdrop-filter:blur(20px)){nav.markdown-article-toc{backdrop-filter:blur(20px)}}@supports (-webkit-backdrop-filter:blur(20px)){nav.markdown-article-toc{-webkit-backdrop-filter:blur(20px)}}nav.markdown-article-toc:not(.should-show-2-levels-at-most) li.has-nested-toc-list.is-expanded>a[href^="#"]:not(:hover):not(:active):not(:focus),nav.markdown-article-toc:not(.should-show-2-levels-at-most) li.has-nested-toc-list>a[href^="#"]:not(:hover):not(:active):not(:focus),nav.markdown-article-toc>ol>li.has-nested-toc-list.is-expanded>a[href^="#"]:not(:hover):not(:active):not(:focus),nav.markdown-article-toc>ol>li.has-nested-toc-list>a[href^="#"]:not(:hover):not(:active):not(:focus),nav.markdown-article-toc>ul>li.has-nested-toc-list.is-expanded>a[href^="#"]:not(:hover):not(:active):not(:focus),nav.markdown-article-toc>ul>li.has-nested-toc-list>a[href^="#"]:not(:hover):not(:active):not(:focus){color:#aaa}}.hljs-emphasis{font-style:italic}.hljs-strong{font-weight:700}.hljs-link{text-decoration-line:underline}pre{scrollbar-color:hsla(0,0%,80%,.75) hsla(0,0%,80%,.15);scrollbar-width:thin}pre::-webkit-scrollbar{border-radius:0;height:.75em;width:.75em}pre::-webkit-scrollbar:hover{background-color:hsla(0,0%,100%,.15)}pre::-webkit-resizer,pre::-webkit-scrollbar-button,pre::-webkit-scrollbar-corner,pre::-webkit-scrollbar-thumb,pre::-webkit-scrollbar-track,pre::-webkit-scrollbar-track-piece{background-clip:content-box;border-color:transparent;border-radius:1em;border-style:solid}pre::-webkit-scrollbar-button{display:none}pre::-webkit-scrollbar-thumb{background-color:hsla(0,0%,100%,.45);border-width:.3em}pre::-webkit-scrollbar-thumb:hover{background-color:#fff}pre::-webkit-scrollbar-track{background-color:hsla(0,0%,100%,.1);border-width:.2em;box-shadow:inset 0 0 0 .05em hsla(0,0%,100%,.1)}pre::-webkit-scrollbar-track:hover{box-shadow:inset 0 0 0 .05em hsla(0,0%,100%,.515)}pre::-webkit-scrollbar-corner,pre::-webkit-scrollbar-track-piece{display:none}.hljs,pre{background-color:#111;color:#ccc}.language-html .actionscript,.language-html .css,.language-html .javascript,.language-xml .actionscript,.language-xml .css,.language-xml .javascript{color:#c9c8c7}.hljs-comment,.hljs-quote{background-color:#000;color:#4c5}.hljs-comment{padding-bottom:.2em;padding-top:.2em}.hljs-meta,.hljs-tag{color:#555}.hljs-doctag,.hljs-formula{color:#8a2be2}.hljs-keyword{color:#a68}.hljs-function{color:#666}.css .hljs-built_in,.language-css .hljs-built_in,.language-less .hljs-built_in,.language-sass .hljs-built_in,.language-stylus .hljs-built_in{color:#d74fff}.hljs-function .hljs-keyword{color:#7ae}.hljs-title{color:#fb5}.hljs-params{color:#6fb}.hljs-name{color:#f79}.language-html,.language-xml{color:#fff}.language-html .hljs-name,.language-xml .hljs-name{color:#dd5151}.hljs-deletion,.hljs-section,.hljs-subst{color:#c66}.hljs-number{color:#af5}.actionscript .hljs-attr,.javascript .hljs-attr,.language-javascript .hljs-attr,.language-js .hljs-attr,.language-ts .hljs-attr,.language-typescript .hljs-attr{color:#fff}.hljs-addition,.hljs-meta-string{color:#39f}.hljs-selector-tag{color:#dd5151}.hljs-selector-id{color:#f8d}.hljs-selector-class{color:#fb6}.hljs-selector-attr{color:#a75}.hljs-attribute{color:#809896}.hljs-selector-pseudo{color:#79fafe}.hljs-built_in{color:#4f8}.hljs-class .hljs-title{color:#6fa}.hljs-attr,.hljs-template-variable,.hljs-type,.hljs-variable{color:#a78057}.hljs-bullet,.hljs-symbol{color:#3af}.hljs-link{color:#59c}.hljs-link:hover{color:#7be}.hljs-link .punctuation{background-color:transparent;color:inherit}.hljs-keyword.var{color:#a67}.hljs-keyword.new{color:#face87}.hljs-keyword.in,.hljs-keyword.instanceof,.hljs-keyword.of{color:#96a}.hljs-keyword.typeof{color:#ee9}.hljs-keyword.this{color:#f9a}.hljs-keyword.delete{color:#f36}.hljs-keyword.case,.hljs-keyword.catch,.hljs-keyword.do,.hljs-keyword.elif,.hljs-keyword.else,.hljs-keyword.finally,.hljs-keyword.for,.hljs-keyword.if,.hljs-keyword.switch,.hljs-keyword.then,.hljs-keyword.try,.hljs-keyword.while{color:#965}.hljs-keyword.break,.hljs-keyword.continue,.hljs-keyword.return,.hljs-keyword.yield{color:#fb9}.hljs-keyword.throw{color:#f64}.hljs-keyword.default{color:#fb9}.hljs-keyword.const{color:#ae6}.hljs-keyword.async,.hljs-keyword.await,.hljs-keyword.export,.hljs-keyword.from,.hljs-keyword.import,.hljs-keyword.let{color:#dd5175}.hljs-keyword.debugger{background-color:rgba(255,0,0,.3);border:1px solid red;color:#fff;padding:.1em .5em .2em}.hljs-literal{color:#2ef}.hljs-literal.undefined{color:#578}.hljs-literal.null{color:#7ab}.hljs-literal.true{color:#98f}.hljs-literal.false{color:#86d}.hljs-literal.NaN{color:#f65}.actionscript .hljs-number,.javascript .hljs-number,.language-javascript .hljs-number,.language-js .hljs-number,.language-ts .hljs-number,.language-typescript .hljs-number{color:#f75}.hljs-built_in{color:unset}.hljs-built_in.Error,.hljs-built_in.EvalError,.hljs-built_in.RangeError,.hljs-built_in.ReferenceError,.hljs-built_in.SyntaxError,.hljs-built_in.TypeError,.hljs-built_in.URIError,.hljs-built_inInternalError{color:#f88}.hljs-built_in.RegExp{color:#f6e}.hljs-built_in.Array,.hljs-built_in.Boolean,.hljs-built_in.Date,.hljs-built_in.LocalStorage,.hljs-built_in.Math,.hljs-built_in.Number,.hljs-built_in.Object,.hljs-built_in.Promise,.hljs-built_in.Set,.hljs-built_in.Storage,.hljs-built_in.String,.hljs-built_in.Worker{color:#f6a}.hljs-built_in.global,.hljs-built_in.window{color:#fc6}.hljs-built_in.document{color:#face79}.hljs-built_in.alert,.hljs-built_in.clearInterval,.hljs-built_in.clearTimeout,.hljs-built_in.confirm,.hljs-built_in.console,.hljs-built_in.prompt,.hljs-built_in.setInterval,.hljs-built_in.setTimeout{color:#b4f}.hljs-built_in.exports,.hljs-built_in.module,.hljs-built_in.require{color:#b57}.hljs-built_in.jQuery,.hljs-built_in.jquery{color:#63f}.hljs-built_in.lodash,.hljs-built_in.underscorejs{color:#ff6}.hljs-built_in.css-current-color{color:#f8f}.inline-pre-whitespaces{white-space:pre}.wlc-punctuation{color:#666}.wlc-punctuation.wlc-greater-than-or-equal-to-sign,.wlc-punctuation.wlc-greater-than-sign,.wlc-punctuation.wlc-less-than-or-equal-to-sign,.wlc-punctuation.wlc-less-than-sign{color:#fb8}.wlc-punctuation.wlc-tripple-equal-signs{color:#fba}.wlc-punctuation.wlc-exclamation-mark-and-double-equal-signs{color:#a35}.wlc-punctuation.wlc-double-equal-signs,.wlc-punctuation.wlc-exclamation-mark-and-equal-sign{background-color:rgba(255,51,51,.2);color:#f33}.wlc-punctuation.wlc-double-pipes{color:#949}.wlc-punctuation.wlc-double-ampersands{color:#f0f}.wlc-punctuation.wlc-pipe{color:#0ff}.wlc-punctuation.wlc-exclamation-marks.even-count{color:#abed69}.wlc-punctuation.wlc-exclamation-marks.odd-count{color:#f15}.wlc-punctuation.wlc-equal-sign{color:#678}.wlc-punctuation.wlc-asterisk,.wlc-punctuation.wlc-forward-slash,.wlc-punctuation.wlc-minus-minus-sign,.wlc-punctuation.wlc-minus-sign,.wlc-punctuation.wlc-percentage-sign,.wlc-punctuation.wlc-plus-plus-sign,.wlc-punctuation.wlc-plus-sign{color:#f79}.wlc-punctuation.wlc-negative-sign{color:#9f3}.wlc-punctuation.wlc-positive-sign{color:#39f}.wlc-punctuation.wlc-arrow-function-sign{color:#7ae}.punctuation{color:#666}.punctuation.greater-than-or-equal-to-sign,.punctuation.greater-than-sign,.punctuation.less-than-or-equal-to-sign,.punctuation.less-than-sign{color:#fb8}.punctuation.tripple-equal-signs{color:#fba}.punctuation.exclamation-mark-and-double-equal-signs{color:#a35}.punctuation.double-equal-signs,.punctuation.exclamation-mark-and-equal-sign{background-color:rgba(255,51,51,.2);color:#f33}.punctuation.double-pipes{color:#949}.punctuation.double-ampersands{color:#f0f}.punctuation.pipe{color:#0ff}.punctuation.exclamation-marks.even-count{color:#abed69}.punctuation.exclamation-marks.odd-count{color:#f15}.punctuation.divide-by-and-assign-to,.punctuation.equal-sign,.punctuation.minus-and-assign-to,.punctuation.modulo-by-and-assign-to,.punctuation.multiply-and-assign-to,.punctuation.plus-and-assign-to{color:#678}.punctuation.asterisk,.punctuation.forward-slash,.punctuation.minus-minus-sign,.punctuation.minus-sign,.punctuation.percentage-sign,.punctuation.plus-plus-sign,.punctuation.plus-sign{color:#f79}.punctuation.negative-sign{color:#9f3}.punctuation.positive-sign{color:#39f}.punctuation.arrow-function-sign{color:#7ae}.hljs-function .hljs-title,.wlc-function-name{color:#f9f}.wlc-built-in-method-name{color:#9d6}.escape-char,.wlc-escape-char{color:#4ac}.escape-char .slash,.wlc-escape-char .slash{opacity:.2}.hljs-string>.punctuation{color:inherit}.hljs-string .string-quote,.hljs-string .wlc-string-quote{color:#996}.hljs-string .string-body,.hljs-string .wlc-string-body,.hljs-string.empty-string .string-quote,.hljs-string.empty-string .wlc-string-quote{color:#ff9}.hljs-string .escape-char,.hljs-string .wlc-escape-char{color:#c75}.hljs-string.string-illegal .string-quote{color:#966}.hljs-string.string-illegal .string-body,.hljs-string.string-illegal.empty-string .string-quote{color:#f99}.hljs-string{color:#ff9}.language-html .hljs-string .string-body,.language-html .hljs-string .wlc-string-body,.language-xml .hljs-string .string-body,.language-xml .hljs-string .wlc-string-body{background-color:transparent}.actionscript .hljs-string .string-body,.actionscript .hljs-string .wlc-string-body,.css .hljs-string .string-body,.css .hljs-string .wlc-string-body,.hljs-string .string-body,.hljs-string .wlc-string-body,.javascript .hljs-string .string-body,.javascript .hljs-string .wlc-string-body{background-color:rgba(255,255,153,.098)}.actionscript .hljs-string.string-illegal .string-body,.css .hljs-string.string-illegal .string-body,.hljs-string.string-illegal .string-body,.javascript .hljs-string.string-illegal .string-body{background-color:hsla(0,100%,80%,.098)}.hljs-regexp .regexp-close-quote,.hljs-regexp .regexp-open-quote{color:#858}.hljs-regexp.regexp-illegal .regexp-close-quote,.hljs-regexp.regexp-illegal .regexp-open-quote{background-color:red;color:#fff}.hljs-regexp,.hljs-regexp .escape-char,.hljs-regexp .wlc-escape-char{color:#f6e}.hljs-regexp .regexp-options{color:#3e1}.hljs-regexp .regexp-selector-input-begin,.hljs-regexp .regexp-selector-input-end{color:#f15}.hljs-regexp .regexp-body{background-color:rgba(255,102,238,.08)}.hljs-regexp .regexp-selector-char,.hljs-regexp .regexp-selector-char.escape-char,.hljs-regexp .regexp-selector-char.wlc-escape-char{color:#4f9}.hljs-regexp .regexp-selector-char.escape-char .slash,.hljs-regexp .regexp-selector-char.wlc-escape-char .slash{opacity:.79}.hljs-regexp .regexp-control-char,.hljs-regexp .regexp-control-char.escape-char,.hljs-regexp .regexp-control-char.wlc-escape-char{color:#379}.hljs-regexp .regexp-control-char.escape-char .slash,.hljs-regexp .regexp-control-char.wlc-escape-char .slash{opacity:.79}.hljs-regexp .digit-pair-between-curly-braces .digit{color:#f75}.hljs-regexp .digit-pair-between-curly-braces .comma{color:#666}.hljs-attr.async{color:#09f}.hljs-built_in.css-named-color,.hljs-number.color-hex-value{color:#69f}.hljs-number.color-hex-value .punctuation,.hljs-selector-class .punctuation,.hljs-selector-id .punctuation{color:inherit;opacity:.51}.hljs-meta.css-exclamation-important{background-color:#422;color:#f55}.css-unit{color:#f8b}.css-unit.absolute-length-unit{color:#d36}.hljs-selector-attr .hljs-attr{color:#f97}.hljs-selector-attr .punctuation.assertion{color:#7f7}.css .hljs-keyword.at_annotation,.css .hljs-keyword.at_character-variant,.css .hljs-keyword.at_charset,.css .hljs-keyword.at_counter-style,.css .hljs-keyword.at_document,.css .hljs-keyword.at_font-face,.css .hljs-keyword.at_font-feature-values,.css .hljs-keyword.at_import,.css .hljs-keyword.at_keyframes,.css .hljs-keyword.at_media,.css .hljs-keyword.at_namespace,.css .hljs-keyword.at_ornaments,.css .hljs-keyword.at_page,.css .hljs-keyword.at_styleset,.css .hljs-keyword.at_stylistic,.css .hljs-keyword.at_supports,.css .hljs-keyword.at_swash,.css .hljs-keyword.at_viewport,.language-css .hljs-keyword.at_annotation,.language-css .hljs-keyword.at_character-variant,.language-css .hljs-keyword.at_charset,.language-css .hljs-keyword.at_counter-style,.language-css .hljs-keyword.at_document,.language-css .hljs-keyword.at_font-face,.language-css .hljs-keyword.at_font-feature-values,.language-css .hljs-keyword.at_import,.language-css .hljs-keyword.at_keyframes,.language-css .hljs-keyword.at_media,.language-css .hljs-keyword.at_namespace,.language-css .hljs-keyword.at_ornaments,.language-css .hljs-keyword.at_page,.language-css .hljs-keyword.at_styleset,.language-css .hljs-keyword.at_stylistic,.language-css .hljs-keyword.at_supports,.language-css .hljs-keyword.at_swash,.language-css .hljs-keyword.at_viewport,.language-less .hljs-keyword.at_annotation,.language-less .hljs-keyword.at_character-variant,.language-less .hljs-keyword.at_charset,.language-less .hljs-keyword.at_counter-style,.language-less .hljs-keyword.at_document,.language-less .hljs-keyword.at_font-face,.language-less .hljs-keyword.at_font-feature-values,.language-less .hljs-keyword.at_import,.language-less .hljs-keyword.at_keyframes,.language-less .hljs-keyword.at_media,.language-less .hljs-keyword.at_namespace,.language-less .hljs-keyword.at_ornaments,.language-less .hljs-keyword.at_page,.language-less .hljs-keyword.at_styleset,.language-less .hljs-keyword.at_stylistic,.language-less .hljs-keyword.at_supports,.language-less .hljs-keyword.at_swash,.language-less .hljs-keyword.at_viewport,.language-sass .hljs-keyword.at_annotation,.language-sass .hljs-keyword.at_character-variant,.language-sass .hljs-keyword.at_charset,.language-sass .hljs-keyword.at_counter-style,.language-sass .hljs-keyword.at_document,.language-sass .hljs-keyword.at_font-face,.language-sass .hljs-keyword.at_font-feature-values,.language-sass .hljs-keyword.at_import,.language-sass .hljs-keyword.at_keyframes,.language-sass .hljs-keyword.at_media,.language-sass .hljs-keyword.at_namespace,.language-sass .hljs-keyword.at_ornaments,.language-sass .hljs-keyword.at_page,.language-sass .hljs-keyword.at_styleset,.language-sass .hljs-keyword.at_stylistic,.language-sass .hljs-keyword.at_supports,.language-sass .hljs-keyword.at_swash,.language-sass .hljs-keyword.at_viewport,.language-stylus .hljs-keyword.at_annotation,.language-stylus .hljs-keyword.at_character-variant,.language-stylus .hljs-keyword.at_charset,.language-stylus .hljs-keyword.at_counter-style,.language-stylus .hljs-keyword.at_document,.language-stylus .hljs-keyword.at_font-face,.language-stylus .hljs-keyword.at_font-feature-values,.language-stylus .hljs-keyword.at_import,.language-stylus .hljs-keyword.at_keyframes,.language-stylus .hljs-keyword.at_media,.language-stylus .hljs-keyword.at_namespace,.language-stylus .hljs-keyword.at_ornaments,.language-stylus .hljs-keyword.at_page,.language-stylus .hljs-keyword.at_styleset,.language-stylus .hljs-keyword.at_stylistic,.language-stylus .hljs-keyword.at_supports,.language-stylus .hljs-keyword.at_swash,.language-stylus .hljs-keyword.at_viewport{color:#a6f}@media print{a,a:visited{text-decoration-line:underline!important}a[href]:after{content:" (" attr(href) ")"!important}abbr[title]:after{content:" (" attr(title) ")"!important}a[href^="#"]:after,a[href^="javascript:"]:after{content:""!important}b,strong{font-weight:700!important}blockquote,pre{page-break-inside:avoid}thead{display:table-header-group}img,tr{page-break-inside:avoid}h2,h3,p{orphans:3;widows:3}h2,h3{page-break-after:avoid}.hidden-spacebar-between-head-linkage-and-head-text{display:inline;height:auto;margin-right:0;overflow:visible;width:auto}}
</style>
</head>
<body class="markdown-article-toc-exists">
<article class="markdown-article">
<h1 id="wulechuan's-article-css-styles-examples" tabindex="-1"><a class="header-anchor" href="#wulechuan's-article-css-styles-examples">§</a> Wulechuan's Article CSS Styles Examples</h1>
<p class="document-author">wulechuan@live.com</p>
<hr>
<h2 id="articles" tabindex="-1"><a class="header-anchor" href="#articles">§</a> Articles</h2>
<h3 id="linkages" tabindex="-1"><a class="header-anchor" href="#linkages">§</a> Linkages</h3>
<p>Aliquip proident nulla ex cillum magna. Anim culpa dolor ullamco nulla culpa labore. Lorem dolor proident qui aliquip nulla. Do ex <a target="_blank" href="https://www.bing.com/">external link 1 (www.bing.com)</a> anim tempor do veniam duis nulla ut culpa tempor dolore. Labore dolore ex anim <a href="#fake-id-2">fake self-page link 2 (do not follow)</a> id. Anim et ex ex labore cupidatat anim proident laboris amet fugiat aute ad. Reprehenderit dolore cupidatat sit elit esse anim est aute <a href="https://www.google.com/">external link 2 (www.google.com)</a> lorem ipsum.</p>
<p>A link to a section of the page itselfs should look a bit different from a link to another page. A so-called page local link looks like: <a href="#a-normal-image">A Normal Image</a>.</p>
<h3 id="lists" tabindex="-1"><a class="header-anchor" href="#lists">§</a> Lists</h3>
<p>See some lists below:</p>
<ul>
<li>
<p>Reprehenderit aute ea pariatur tempor labore. Ullamco do incididunt sint velit duis ipsum irure amet voluptate. Cupidatat et do occaecat <code>nulla</code>. Nulla voluptate enim aute <strong>emphasized texts <em>italic phrase</em> nisi qui qui et et irure. Dolore mollit dolore adipisicing consectetur sit.</strong> Aliquip fugiat Lorem in sunt Lorem aliqua ex in sunt.</p>
<p>Nisi minim nulla elit non ut labore <strong>aliquip et deserunt</strong> culpa. Sint amet est laborum eu irure voluptate. In id et proident nulla pariatur ex cupi-datat labore aliqua.</p>
</li>
<li>
<p>Non adipisicing consectetur <a target="_blank" href="https://www.softimage.com/"><code>SOFTIMAGE.com</code></a> quis anim ea consequat.</p>
<ul>
<li>Aliqua excepteur nostrud ad <code>ullamco</code> minim commodo esse</li>
<li>elit <s><a target="_blank" href="https://www.1.2.3.4.org/">a linkage that simply does not exist</a></s> nulla.</li>
<li>Sint est elit sint minim.</li>
</ul>
</li>
<li>
<p>Sunt ex eiusmod reprehenderit ullamco <em>fugiat</em> ex duis cupidatat velit. Cillum commodo mollit dolore occaecat. Nulla Lorem deserunt minim ea nostrud reprehenderit do qui anim duis dolor.</p>
</li>
<li>
<p>Amet veniam exercitation aliquip enim fugiat <s>nostrud consectetur aute mollit ullamco exercitation.</s> Incididunt consequat Lorem veniam aute qui non occaecat est <strong>sit sint nulla</strong> ipsum duis.</p>
</li>
<li>
<p>Mollit nisi quis laboris officia. Ut ullamco cupidatat ex mollit duis. Officia nulla esse commodo exercitation nostrud. Laboris amet sunt exercitation velit ea. Aliquip <a href="#fake-id-2">fake self-page link 2 (do not follow)</a> ex ipsum nulla voluptate laboris sit cillum incididunt pariatur enim irure non. Nostrud commodo labore adipisicing ullamco occaecat fugiat enim mollit. Deserunt sunt aute in amet nostrud cupidatat amet adipisicing est consectetur aute ex irure.</p>
<p>Velit mollit amet dolore eiusmod ad nulla. Adipisicing nostrud ut elit consectetur non sunt pariatur commodo eiusmod duis fugiat proident aute enim.</p>
<ol>
<li>Non adipisicing tempor deserunt ullamco dolore.</li>
<li>Voluptate minim dolore sunt dolor cupidatat nulla duis tempor pariatur velit veniam. Commodo labore id nulla cillum incididunt nostrud laboris deserunt dolor id nisi.</li>
<li>Cillum ipsum labore in ut excepteur culpa ipsum.</li>
<li>Nostrud quis mollit Lorem qui ullamco dolor in mollit fugiat laborum.</li>
</ol>
<p>Et consequat eiusmod culpa eiusmod fugiat pariatur aliquip voluptate laborum. Est incididunt proident amet irure magna occaecat ad reprehenderit. Eu ullamco cupidatat qui ut ea sunt in nulla ullamco aliquip</p>
</li>
<li>
<p>est dolore ex quis.</p>
</li>
</ul>
<ol>
<li>
<p>Eu irure minim do reprehenderit sint et labore ut in tempor. Velit in mollit deserunt consequat. Minim quis officia esse elit ex enim duis laboris <kbd>Ctrl</kbd> + <kbd>Alt</kbd> + <kbd>Del</kbd> aliqua consectetur. Officia esse proident magna consequat cillum. Dolore consequat proident ex ad nostrud tempor esse ullamco incididunt. Irure elit amet enim enim anim culpa id sunt quis quis laboris.</p>
</li>
<li>
<p>Qui et tempor sit irure cillum. Deserunt non cillum nisi nisi nisi ad consectetur nostrud consectetur <a target="_blank" href="https://www.bing.com/">external link 1 (www.bing.com)</a> fugiat aliquip. Officia fugiat incididunt sint cupidatat incididunt dolore culpa deserunt commodo. Aliquip adipisicing enim occaecat proident quis. Eiusmod est nulla do duis nostrud anim.</p>
<ul>
<li>Lorem duis</li>
<li>et qui dolor ex</li>
<li>dolore</li>
<li>Qui velit <kbd>Ctrl</kbd> key elit quis est consectetur</li>
<li>ullamco ut</li>
<li>consectetur proident sint laboris</li>
<li>cupidatat amet</li>
<li>velit</li>
<li>Ex enim cupidatat do</li>
<li>laborum est deserunt</li>
<li>est deserunt.</li>
</ul>
</li>
<li>
<p>Sit aute est occaecat fugiat. Eu ipsum sit qui est sunt ex velit qui dolor eu adipisicing nulla. Duis minim reprehenderit laboris duis aliquip fugiat proident reprehenderit veniam magna esse ipsum quis ex. Proident reprehenderit officia deserunt sint enim.</p>
</li>
</ol>
<h3 id="inline-codes-in-multiple-lines" tabindex="-1"><a class="header-anchor" href="#inline-codes-in-multiple-lines">§</a> Inline Codes in Multiple Lines</h3>
<p>Occaecat ea Lorem ut <code>officia</code> ea ad <code>nostrud</code>. Ut deserunt irure in dolore <code>voluptate</code> ad <code>reprehenderit</code> et sit. Cupidatat <code>nostrud</code> tempor <code>aliqua</code> ad id ex <code>labore</code> in. Ut deserunt irure pariatur <code>tempor</code> ex. Ex <code>irure</code> sit proident <code>consectetur</code> ipsum <code>pariatur</code>.</p>
<h3 id="quoted-block" tabindex="-1"><a class="header-anchor" href="#quoted-block">§</a> Quoted Block</h3>
<h4 id="what-is-github" tabindex="-1"><a class="header-anchor" href="#what-is-github">§</a> What is GitHub</h4>
<p>According to <a target="_blank" href="https://www.howtogeek.com/180167/htg-explains-what-is-github-and-what-do-geeks-use-it-for/">KORBIN BROWN</a>:</p>
<blockquote>
<h3 id="github" tabindex="-1"><a class="header-anchor" href="#github">§</a> GitHub</h3>
<p><a target="_blank" href="https://github.com/" title="https://github.com">Github</a> is a website and service that we hear geeks rave about all the time, yet a lot of people don’t really understand what it does. Want to know what all the GitHub hubbub is about? Read on to find out.</p>
</blockquote>
<p>See, it’s a website for anyone, but mostly engineers.</p>
<h2 id="illustrates(images)" tabindex="-1"><a class="header-anchor" href="#illustrates(images)">§</a> Illustrates(Images)</h2>
<h3 id="a-normal-image" tabindex="-1"><a class="header-anchor" href="#a-normal-image">§</a> A Normal Image</h3>
<p><img src="./illustrates/duan-er-pretty.jpg" alt="Duan er is a pretty boy" title="Duan er is a pretty boy"></p>
<h3 id="an-image-that-fails-to-load" tabindex="-1"><a class="header-anchor" href="#an-image-that-fails-to-load">§</a> An Image that Fails to Load</h3>
<p><img src="./images/beauty.jpg" alt="A Beauty"></p>
<hr>
<h2 id="videos" tabindex="-1"><a class="header-anchor" href="#videos">§</a> Videos</h2>
<video controls>
<source src="./illustrates/flower.webm" type="video/webm">
Sorry, your browser doesn't support embedded videos.
</video>
<details open>
<summary>A Video Nested in a Details Block</summary>
<video controls>
<source src="./illustrates/flower.webm" type="video/webm">
Sorry, your browser doesn't support embedded videos.
</video>
</details>
<hr>
<h2 id="code-snippets" tabindex="-1"><a class="header-anchor" href="#code-snippets">§</a> Code Snippets</h2>
<ul>
<li>
<p>Code Snippet Nested under a List Item</p>
<pre><code class="hljs language-js"><span class="hljs-keyword function">function</span> <span class="hljs-title function_">getCircleArea</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-params">r</span><span class="punctuation parenthesis close-parenthesis">)</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-keyword return">return</span> <span class="hljs-number">3.14159265</span> <span class="punctuation asterisk">*</span> r <span class="punctuation asterisk">*</span> r<span class="punctuation semi-colon">;</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-title function_">getCircleArea</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-number">100</span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span><br
></code></pre>
</li>
<li>
<pre><code class="hljs language-js"><span class="hljs-keyword function">function</span> <span class="hljs-title function_">getCircumference</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-params">r</span><span class="punctuation parenthesis close-parenthesis">)</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-keyword return">return</span> <span class="hljs-number">2</span> <span class="punctuation asterisk">*</span> <span class="hljs-number">3.14159265</span> <span class="punctuation asterisk">*</span> r<span class="punctuation semi-colon">;</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-title function_">getCircumference</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-number">100</span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span><br
></code></pre>
</li>
</ul>
<p>Below is a code snippet nested under details block.</p>
<details open>
<summary>Foldable Code Snippet</summary>
<pre><code class="hljs language-js"><span class="hljs-variable language_">console</span><span class="punctuation period">.</span><span class="hljs-title function_">log</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-title class_">NaN</span> <span class="punctuation tripple-equal-signs">===</span> <span class="hljs-title class_">NaN</span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span> <span class="hljs-comment">// false</span><br
></code></pre>
</details>
<h3 id="a-javascript-snippet" tabindex="-1"><a class="header-anchor" href="#a-javascript-snippet">§</a> A JavaScript Snippet</h3>
<pre><code class="hljs language-javascript"><span class="hljs-comment">// This is a comment.</span><br
><span class="hljs-keyword import">import</span> something <span class="hljs-keyword from">from</span> <span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">somethingjs</span><span class="string-quote string-close-quote">'</span></span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-keyword var">var</span> myModule <span class="punctuation equal-sign">=</span> <span class="hljs-built_in require">require</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">my-module</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-keyword const">const</span> author <span class="punctuation equal-sign">=</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr">name</span><span class="punctuation colon">:</span> <span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">wulechuan</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation comma">,</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr">age</span><span class="punctuation colon">:</span> <span class="hljs-number">40</span><span class="punctuation comma">,</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-keyword var">var</span> newsThatAreNotNewsAnyMore <span class="punctuation equal-sign">=</span> <span class="punctuation bracket open-bracket">[</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">SOFTIMAGE Co<span class="escape-char"><span class="slash">\</span><span class="escaped-char">.</span></span> Released SOFTIMAGE<span class="escape-char"><span class="slash">\</span><span class="escaped-char">|</span></span>3D Extreme</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation comma">,</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">Discreet Released 3D STUDIO MAX</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation comma">,</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">Alias|Wavefront Released Maya<span class="escape-char"><span class="slash">\</span><span class="escaped-char">|</span></span>Unlimited</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation comma">,</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">SOFTIMAGE Co<span class="escape-char"><span class="slash">\</span><span class="escaped-char">.</span></span> Released SOFTIMAGE<span class="escape-char"><span class="slash">\</span><span class="escaped-char">|</span></span>XSI Advanced</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation comma">,</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">Cebas Released Cinema 4D</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation comma">,</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">SideFX Released Houdini</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation comma">,</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">Pixar Released RenderMan</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation comma">,</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">MentalImages Released MentalRay</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation comma">,</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">SolidAngle Released Arnold Render</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation comma">,</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">NextLimit Released MaxwellRender</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation comma">,</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">RandomControl Released Arion Render</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation comma">,</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">OTOY Released OctaneRender</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation comma">,</span><br
><span class="punctuation bracket close-bracket">]</span><br
><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-keyword let">let</span> anUndefinedValue <span class="punctuation equal-sign">=</span> <span class="hljs-literal undefined">undefined</span><span class="punctuation semi-colon">;</span> <span class="hljs-comment">// A semi looks like this</span><br
><span class="hljs-keyword let">let</span> aNull <span class="punctuation equal-sign">=</span> <span class="hljs-literal null">null</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-keyword var">var</span> anInteger <span class="punctuation equal-sign">=</span> <span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-number">19</span> <span class="punctuation plus-sign">+</span> <span class="hljs-number">3</span> <span class="punctuation asterisk">*</span> <span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-number">79</span> - <span class="hljs-number">51</span><span class="punctuation parenthesis close-parenthesis">)</span> <span class="punctuation plus-sign">+</span> <span class="hljs-number">2013</span><span class="punctuation parenthesis close-parenthesis">)</span> <span class="punctuation percentage-sign">%</span> <span class="hljs-number">2</span><br
><span class="inline-pre-whitespaces indentation"><br
></span>anInteger<span class="punctuation plus-plus-sign">++</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="punctuation plus-plus-sign">++</span>anInteger<span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"><br
></span>anInteger<span class="punctuation minus-minus-sign">--</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-title class_">Math</span><span class="punctuation period">.</span><span class="hljs-title function_">max</span><span class="punctuation parenthesis open-parenthesis">(</span>anInteger<span class="punctuation comma">,</span> -<span class="hljs-number">90</span><span class="punctuation parenthesis close-parenthesis">)</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-keyword const">const</span> cellPhoneNumberRegExp <span class="punctuation equal-sign">=</span> <span class="hljs-regexp"><span class="regexp-quote regexp-open-quote">/</span><span class="regexp-body"><span class="regexp-selector-input-begin">^</span>1<span class="escape-char regexp-selector-char regexp-selector-digit "><span class="slash">\</span><span class="escaped-char selector-char">d</span></span><span class="regexp-control-char regexp-control-curly-brace open-curly-brace"><span class="control-char">{</span></span><span class="digit-pair-between-curly-braces"><span class="digit digit-1">2</span><span class="comma"></span><span class="digit digit-2"></span></span><span class="regexp-control-char regexp-control-curly-brace close-curly-brace"><span class="control-char">}</span></span><span class="regexp-control-char regexp-control-capture open-parenthesis"><span class="control-char">(</span></span><span class="regexp-control-char regexp-control-candidate-chars open-braket">[</span>- <span class="regexp-control-char regexp-control-open-braket close-braket">]</span><span class="regexp-control-char regexp-control-question-mark "><span class="control-char">?</span></span><span class="escape-char regexp-selector-char regexp-selector-digit "><span class="slash">\</span><span class="escaped-char selector-char">d</span></span><span class="regexp-control-char regexp-control-curly-brace open-curly-brace"><span class="control-char">{</span></span><span class="digit-pair-between-curly-braces"><span class="digit digit-1">4</span><span class="comma"></span><span class="digit digit-2"></span></span><span class="regexp-control-char regexp-control-curly-brace close-curly-brace"><span class="control-char">}</span></span><span class="regexp-control-char regexp-control-capture close-parenthesis"><span class="control-char">)</span></span><span class="regexp-control-char regexp-control-curly-brace open-curly-brace"><span class="control-char">{</span></span><span class="digit-pair-between-curly-braces"><span class="digit digit-1">2</span><span class="comma"></span><span class="digit digit-2"></span></span><span class="regexp-control-char regexp-control-curly-brace close-curly-brace"><span class="control-char">}</span></span><span class="regexp-selector-input-end">$</span></span><span class="regexp-quote regexp-close-quote">/</span><span class="regexp-options"></span></span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-keyword let">let</span> cellPhoneNumber <span class="punctuation equal-sign">=</span> <span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">13345678901 </span><span class="string-quote string-close-quote">'</span></span><br
>cellPhoneNumber <span class="punctuation equal-sign">=</span> cellPhoneNumber<span class="punctuation period">.</span><span class="hljs-title function_">trim</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="punctuation parenthesis close-parenthesis">)</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-keyword const">const</span> cellPhoneNumberIsValid <span class="punctuation equal-sign">=</span> cellPhoneNumberRegExp<span class="punctuation period">.</span><span class="hljs-title function_">test</span><span class="punctuation parenthesis open-parenthesis">(</span>cellPhoneNumber<span class="punctuation parenthesis close-parenthesis">)</span><br
><span class="hljs-variable language_">console</span><span class="punctuation period">.</span><span class="hljs-title function_">log</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">cellPhoneNumberIsValid</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation comma">,</span> cellPhoneNumberIsValid<span class="punctuation parenthesis close-parenthesis">)</span> <span class="hljs-comment">// true</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-keyword var">var</span> aString <span class="punctuation equal-sign">=</span> <span class="hljs-string"><span class="string-quote string-open-quote">`</span><span class="string-body">Meaningless <span class="hljs-subst">${cellPhoneNumber}</span> </span><span class="string-quote string-close-quote">`</span></span> <span class="punctuation plus-sign">+</span> <span class="punctuation exclamation-marks odd-count">!!!</span><span class="hljs-literal true">true</span> <span class="punctuation plus-sign">+</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body"> </span><span class="string-quote string-close-quote">'</span></span> <span class="punctuation plus-sign">+</span> <span class="hljs-number">15</span> <span class="punctuation plus-sign">+</span> <span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body"> </span><span class="string-quote string-close-quote">'</span></span> <span class="punctuation plus-sign">+</span> <span class="punctuation exclamation-marks odd-count">!</span><span class="hljs-literal false">false</span> <span class="punctuation plus-sign">+</span> <span class="hljs-title class_">Math</span><span class="punctuation period">.</span><span class="hljs-title function_">random</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation period">.</span><span class="hljs-title function_">toFixed</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-number">4</span><span class="punctuation parenthesis close-parenthesis">)</span><br
><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-keyword const">const</span> aBoolean <span class="punctuation equal-sign">=</span> <span class="hljs-literal true">true</span> <span class="punctuation double-pipes">||</span> <span class="hljs-literal false">false</span> <span class="punctuation double-ampersands">&&</span> <span class="punctuation exclamation-marks odd-count">!</span><span class="hljs-literal true">true</span> <span class="punctuation double-ampersands">&&</span> <span class="punctuation exclamation-marks even-count">!!</span><span class="hljs-literal false">false</span> <span class="punctuation double-pipes">||</span> <span class="punctuation exclamation-marks odd-count">!</span><span class="hljs-number">0</span> <span class="punctuation double-ampersands">&&</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="punctuation exclamation-marks even-count">!!</span><span class="hljs-number">1</span> <span class="punctuation double-pipes">||</span> <span class="hljs-number">9</span> <span class="punctuation less-than-sign"><</span> <span class="hljs-number">6</span> <span class="punctuation double-ampersands">&&</span> <span class="hljs-number">8</span> <span class="punctuation greater-than-or-equal-to-sign">>=</span> <span class="hljs-number">8</span> <span class="punctuation double-pipes">||</span> <span class="hljs-title class_">NaN</span> <span class="punctuation tripple-equal-signs">===</span> <span class="hljs-title class_">NaN</span> <span class="punctuation double-ampersands">&&</span> <span class="hljs-number">10</span> <span class="punctuation greater-than-sign">></span> <span class="hljs-number">13</span><span class="punctuation semi-colon">;</span><br
><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-keyword var">var</span> a<span class="punctuation comma">,</span> b<span class="punctuation comma">,</span> c<span class="punctuation comma">,</span> d <span class="punctuation equal-sign">=</span> <span class="hljs-number">11</span><span class="punctuation comma">,</span> e <span class="punctuation equal-sign">=</span> <span class="hljs-number">12</span><span class="punctuation comma">,</span> f<span class="punctuation comma">,</span> g <span class="punctuation equal-sign">=</span> anInteger <span class="punctuation less-than-or-equal-to-sign"><=</span> <span class="hljs-number">1024</span> <span class="punctuation plus-sign">+</span> -<span class="hljs-number">1e<span class="punctuation positive-sign">+</span>8</span><span class="punctuation semi-colon">;</span><br
>f <span class="punctuation equal-sign">=</span> <span class="hljs-number">2e<span class="punctuation negative-sign">-</span>5</span> / <span class="hljs-number">16</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-keyword let">let</span> isAnArray <span class="punctuation equal-sign">=</span> <span class="hljs-literal false">false</span><br
><span class="hljs-keyword if">if</span> <span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-title class_">Array</span><span class="punctuation period">.</span><span class="hljs-title function_">isArray</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="punctuation bracket open-bracket">[</span><span class="punctuation bracket close-bracket">]</span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation parenthesis close-parenthesis">)</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span>isAnArray <span class="punctuation equal-sign">=</span> <span class="hljs-literal true">true</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-keyword const">const</span> regExp <span class="punctuation equal-sign">=</span> <span class="hljs-keyword new">new</span> <span class="hljs-title class_">RegExp</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body"><span class="escape-char"><span class="slash">\</span><span class="escaped-char">\</span></span>w+</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation comma">,</span> <span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">i</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation parenthesis close-parenthesis">)</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-keyword const">const</span> regExp1 <span class="punctuation equal-sign">=</span> <span class="hljs-regexp"><span class="regexp-quote regexp-open-quote">/</span><span class="regexp-body"><span class="regexp-selector-input-begin">^</span><span class="escape-char regexp-literal-char regexp-literal-braketopen-braket"><span class="slash">\</span><span class="escaped-char">[</span></span><span class="regexp-control-char regexp-control-candidate-chars open-braket">[</span><span class="regexp-control-char regexp-control-invert"><span class="control-char">^</span></span><span class="escape-char"><span class="slash">\</span><span class="escaped-char"><</span></span><span class="regexp-control-char regexp-control-open-braket close-braket">]</span><span class="regexp-control-char regexp-control-capture open-parenthesis"><span class="control-char">(</span></span><span class="escape-char regexp-literal-char regexp-literal-parenthesisopen-parenthesis"><span class="slash">\</span><span class="escaped-char">(</span></span><span class="regexp-control-char regexp-control-logic-or "><span class="control-char">|</span></span><span class="escape-char regexp-literal-char regexp-literal-parenthesisclose-parenthesis"><span class="slash">\</span><span class="escaped-char">)</span></span><span class="regexp-control-char regexp-control-capture close-parenthesis"><span class="control-char">)</span></span><span class="escape-char"><span class="slash">\</span><span class="escaped-char">$</span></span><span class="escape-char regexp-literal-char regexp-literal-curly-braceopen-curly-brace"><span class="slash">\</span><span class="escaped-char">{</span></span><span class="regexp-control-char regexp-control-candidate-chars open-braket">[</span><span class="regexp-char-range"><span class="regexp-char-range-start-char">a</span><span class="regexp-control-char regexp-control-range-sign">-</span><span class="regexp-char-range-end-char">z</span></span><span class="escape-char regexp-selector-char regexp-selector-digit "><span class="slash">\</span><span class="escaped-char selector-char">d</span></span>_-<span class="regexp-control-char regexp-control-open-braket close-braket">]</span><span class="regexp-control-char regexp-control-plus-sign "><span class="control-char">+</span></span><span class="regexp-control-char regexp-control-candidate-chars open-braket">[</span><span class="escape-char regexp-selector-char regexp-selector-word "><span class="slash">\</span><span class="escaped-char selector-char">w</span></span><span class="escape-char regexp-literal-char regexp-literal-period"><span class="slash">\</span><span class="escaped-char">.</span></span><span class="regexp-control-char regexp-control-open-braket close-braket">]</span><span class="regexp-control-char regexp-control-curly-brace open-curly-brace"><span class="control-char">{</span></span><span class="digit-pair-between-curly-braces"><span class="digit digit-1">16</span><span class="comma">,</span><span class="digit digit-2"></span></span><span class="regexp-control-char regexp-control-curly-brace close-curly-brace"><span class="control-char">}</span></span>a<span class="regexp-control-char regexp-control-asterisk "><span class="control-char">*</span></span>b<span class="regexp-control-char regexp-control-asterisk "><span class="control-char">*</span></span><span class="escape-char regexp-literal-char regexp-literal-asterisk"><span class="slash">\</span><span class="escaped-char">*</span></span><span class="escape-char"><span class="slash">\</span><span class="escaped-char">\</span></span>,<span class="escape-char regexp-literal-char regexp-literal-braketclose-braket"><span class="slash">\</span><span class="escaped-char">]</span></span><span class="escape-char"><span class="slash">\</span><span class="escaped-char">^</span></span>"--toc<span class="regexp-selector-char regexp-selector-any-char">.</span>min<span class="escape-char regexp-literal-char regexp-literal-period"><span class="slash">\</span><span class="escaped-char">.</span></span>js<span class="regexp-selector-input-end">$</span></span><span class="regexp-quote regexp-close-quote">/</span><span class="regexp-options">gi</span></span><span class="punctuation semi-colon">;</span><br
><span class="hljs-keyword const">const</span> regExp2 <span class="punctuation equal-sign">=</span> <span class="hljs-regexp"><span class="regexp-quote regexp-open-quote">/</span><span class="regexp-body"><span class="regexp-control-char regexp-control-capture open-parenthesis"><span class="control-char">(</span></span><span class="regexp-selector-input-begin">^</span><span class="regexp-control-char regexp-control-logic-or "><span class="control-char">|</span></span><<span class="regexp-control-char regexp-control-capture close-parenthesis"><span class="control-char">)</span></span><span class="regexp-control-char regexp-control-candidate-chars open-braket">[</span><span class="escape-char regexp-literal-char regexp-literal-braketclose-braket"><span class="slash">\</span><span class="escaped-char">]</span></span><span class="regexp-char-range"><span class="regexp-char-range-start-char">A</span><span class="regexp-control-char regexp-control-range-sign">-</span><span class="regexp-char-range-end-char">Z</span></span><span class="regexp-char-range"><span class="regexp-char-range-start-char">a</span><span class="regexp-control-char regexp-control-range-sign">-</span><span class="regexp-char-range-end-char">z</span></span>-_][_<span class="regexp-char-range"><span class="regexp-char-range-start-char">a</span><span class="regexp-control-char regexp-control-range-sign">-</span><span class="regexp-char-range-end-char">z</span></span><span class="escape-char regexp-selector-char regexp-selector-digit "><span class="slash">\</span><span class="escaped-char selector-char">d</span></span>_-:<span class="escape-char"><span class="slash">\</span><span class="escaped-char">$</span></span><span class="regexp-control-char regexp-control-open-braket close-braket">]</span><span class="regexp-control-char regexp-control-asterisk "><span class="control-char">*</span></span><span class="regexp-control-char regexp-control-candidate-chars open-braket">[</span><span class="regexp-control-char regexp-control-invert"><span class="control-char">^</span></span>+<span class="regexp-control-char regexp-control-open-braket close-braket">]</span><span class="regexp-control-char regexp-control-candidate-chars open-braket">[</span>+-<span class="regexp-control-char regexp-control-open-braket close-braket">]</span><span class="regexp-control-char regexp-control-capture open-parenthesis"><span class="control-char">(</span></span>><span class="regexp-control-char regexp-control-logic-or "><span class="control-char">|</span></span><span class="regexp-selector-input-end">$</span><span class="regexp-control-char regexp-control-capture close-parenthesis"><span class="control-char">)</span></span></span><span class="regexp-quote regexp-close-quote">/</span><span class="regexp-options">g</span></span><br
><span class="hljs-keyword const">const</span> regExp3 <span class="punctuation equal-sign">=</span> <span class="hljs-regexp"><span class="regexp-quote regexp-open-quote">/</span><span class="regexp-body"><span class="regexp-control-char regexp-control-candidate-chars open-braket">[</span><span class="regexp-control-char regexp-control-invert"><span class="control-char">^</span></span>a+<span class="regexp-control-char regexp-control-open-braket close-braket">]</span><span class="regexp-control-char regexp-control-capture open-parenthesis"><span class="control-char">(</span></span><span class="regexp-control-char regexp-control-candidate-chars open-braket">[</span>)-+<span class="regexp-control-char regexp-control-open-braket close-braket">]</span><span class="regexp-control-char regexp-control-capture close-parenthesis"><span class="control-char">)</span></span></span><span class="regexp-quote regexp-close-quote">/</span><span class="regexp-options"></span></span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-keyword const">const</span> windowMethods <span class="punctuation equal-sign">=</span> <span class="hljs-title class_">Object</span><span class="punctuation period">.</span><span class="hljs-title function_">keys</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-variable language_">window</span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation period">.</span><span class="hljs-title function_">map</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-function"><span class="hljs-params">k</span> <span class="punctuation arrow-function-sign">=></span></span> <span class="hljs-variable language_">window</span><span class="punctuation bracket open-bracket">[</span>k<span class="punctuation bracket close-bracket">]</span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation period">.</span><span class="hljs-title function_">filter</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-function"><span class="hljs-params">p</span> <span class="punctuation arrow-function-sign">=></span></span> <span class="hljs-keyword typeof">typeof</span> p <span class="punctuation tripple-equal-signs">===</span> <span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">function</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation parenthesis close-parenthesis">)</span><br
><span class="hljs-variable language_">console</span><span class="punctuation period">.</span><span class="hljs-title function_">log</span><span class="punctuation parenthesis open-parenthesis">(</span>windowMethods<span class="punctuation parenthesis close-parenthesis">)</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-keyword if">if</span> <span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-literal false">false</span><span class="punctuation parenthesis close-parenthesis">)</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-keyword throw">throw</span> <span class="hljs-title class_">TypeError</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">Should not throw here!</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation parenthesis close-parenthesis">)</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="hljs-keyword if">if</span> <span class="punctuation parenthesis open-parenthesis">(</span>a <span class="punctuation double-equal-signs">==</span> <span class="hljs-literal undefined">undefined</span><span class="punctuation parenthesis close-parenthesis">)</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-variable language_">console</span><span class="punctuation period">.</span><span class="hljs-title function_">log</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">double equal signs used, instead of triple ones</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation parenthesis close-parenthesis">)</span><br
><span class="punctuation curly-brace close-curly-brace">}</span> <span class="hljs-keyword else">else</span> <span class="hljs-keyword if">if</span> <span class="punctuation parenthesis open-parenthesis">(</span>a <span class="punctuation exclamation-mark-and-equal-sign">!=</span> <span class="hljs-literal undefined">undefined</span><span class="punctuation parenthesis close-parenthesis">)</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-variable language_">console</span><span class="punctuation period">.</span><span class="hljs-title function_">log</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">"!=" used, instead of "!=="</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation parenthesis close-parenthesis">)</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"><br
></span>$<span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-keyword function">function</span> <span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-params">e</span><span class="punctuation parenthesis close-parenthesis">)</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-title function_">alert</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">DOMs are ready</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation parenthesis close-parenthesis">)</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-variable language_">console</span><span class="punctuation period">.</span><span class="hljs-title function_">log</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-variable language_">window</span><span class="punctuation period">.</span><span class="hljs-property">innerHeight</span><span class="punctuation comma">,</span> <span class="hljs-variable language_">window</span><span class="punctuation period">.</span><span class="hljs-property">self</span><span class="punctuation comma">,</span> <span class="hljs-variable language_">global</span><span class="punctuation parenthesis close-parenthesis">)</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><span class="punctuation parenthesis close-parenthesis">)</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-keyword const">const</span> <span class="hljs-title function_">anArrowFunction</span> <span class="punctuation equal-sign">=</span> <span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-params">count</span><span class="punctuation parenthesis close-parenthesis">)</span> <span class="punctuation arrow-function-sign">=></span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-keyword for">for</span> <span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-keyword var">var</span> i <span class="punctuation equal-sign">=</span> <span class="hljs-number">0</span><span class="punctuation semi-colon">;</span> i<span class="punctuation less-than-sign"><</span>count<span class="punctuation semi-colon">;</span> i<span class="punctuation plus-plus-sign">++</span><span class="punctuation parenthesis close-parenthesis">)</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-keyword if">if</span> <span class="punctuation parenthesis open-parenthesis">(</span>i <span class="punctuation tripple-equal-signs">===</span> <span class="hljs-number">3</span><span class="punctuation parenthesis close-parenthesis">)</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-keyword continue">continue</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="punctuation curly-brace close-curly-brace">}</span><br
><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-keyword if">if</span> <span class="punctuation parenthesis open-parenthesis">(</span>i <span class="punctuation exclamation-mark-and-double-equal-signs">!==</span> <span class="hljs-number">6</span><span class="punctuation parenthesis close-parenthesis">)</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-variable language_">console</span><span class="punctuation period">.</span><span class="hljs-title function_">log</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">Not six</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation parenthesis close-parenthesis">)</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="punctuation curly-brace close-curly-brace">}</span><br
><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-keyword debugger">debugger</span><br
><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-keyword switch">switch</span> <span class="punctuation parenthesis open-parenthesis">(</span>i <span class="punctuation percentage-sign">%</span> <span class="hljs-number">2</span><span class="punctuation parenthesis close-parenthesis">)</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-keyword case">case</span> <span class="hljs-number">0</span><span class="punctuation colon">:</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr">default</span><span class="punctuation colon">:</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-variable language_">console</span><span class="punctuation period">.</span><span class="hljs-title function_">log</span><span class="punctuation parenthesis open-parenthesis">(</span>i<span class="punctuation comma">,</span> <span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">It<span class="escape-char"><span class="slash">\</span><span class="escaped-char">'</span></span>s an even number.</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation parenthesis close-parenthesis">)</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-keyword break">break</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-keyword case">case</span> <span class="hljs-number">1</span><span class="punctuation colon">:</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-variable language_">console</span><span class="punctuation period">.</span><span class="hljs-title function_">log</span><span class="punctuation parenthesis open-parenthesis">(</span>i<span class="punctuation comma">,</span> <span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">It<span class="escape-char"><span class="slash">\</span><span class="escaped-char">'</span></span>s an odd number.</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation parenthesis close-parenthesis">)</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-keyword break">break</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="punctuation curly-brace close-curly-brace">}</span><br
><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-keyword if">if</span> <span class="punctuation parenthesis open-parenthesis">(</span>i <span class="punctuation greater-than-or-equal-to-sign">>=</span> <span class="hljs-number">10000</span><span class="punctuation parenthesis close-parenthesis">)</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-keyword break">break</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-variable language_">window</span><span class="punctuation period">.</span><span class="hljs-property">tempString</span> <span class="punctuation equal-sign">=</span> <span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body"><span class="escape-char"><span class="slash">\</span><span class="escaped-char">n</span></span>hello<span class="escape-char"><span class="slash">\</span><span class="escaped-char">n</span></span> unnecessary escaped chars: <span class="escape-char"><span class="slash">\</span><span class="escaped-char">m</span></span> <span class="escape-char"><span class="slash">\</span><span class="escaped-char">p</span></span> <span class="escape-char"><span class="slash">\</span><span class="escaped-char">-</span></span> <span class="escape-char"><span class="slash">\</span><span class="escaped-char">.</span></span></span><span class="string-quote string-close-quote">'</span></span><br
><span class="hljs-keyword delete">delete</span> <span class="hljs-variable language_">window</span><span class="punctuation period">.</span><span class="hljs-property">tempString</span><br
><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-variable language_">window</span><span class="punctuation bracket open-bracket">[</span><span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">temp-string-2</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation bracket close-bracket">]</span> <span class="punctuation equal-sign">=</span> <span class="hljs-string"><span class="string-quote string-open-quote">`</span><span class="string-body"><br
><span class="inline-pre-whitespaces indentation"> </span>multiple<br
><span class="inline-pre-whitespaces indentation"> </span>lines<br
><span class="inline-pre-whitespaces indentation"> </span>are<br
><span class="inline-pre-whitespaces indentation"> </span>occupied.<br
></span><span class="string-quote string-close-quote">`</span></span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-keyword var">var</span> num <span class="punctuation equal-sign">=</span> <span class="hljs-number">10</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"><br
></span>num <span class="punctuation plus-and-assign-to">+=</span> <span class="hljs-number">2</span><span class="punctuation semi-colon">;</span><br
>num <span class="punctuation minus-and-assign-to">-=</span> <span class="hljs-number">2</span><span class="punctuation semi-colon">;</span><br
>num <span class="punctuation multiply-and-assign-to">*=</span> <span class="hljs-number">2</span><span class="punctuation semi-colon">;</span><br
>num <span class="punctuation divide-by-and-assign-to">/=</span> <span class="hljs-number">2</span><span class="punctuation semi-colon">;</span><br
>num <span class="punctuation modulo-by-and-assign-to">%=</span> <span class="hljs-number">2</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-keyword var">var</span> now <span class="punctuation equal-sign">=</span> <span class="hljs-keyword new">new</span> <span class="hljs-title class_">Date</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="punctuation parenthesis close-parenthesis">)</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-keyword const">const</span> ul <span class="punctuation equal-sign">=</span> <span class="hljs-title class_">Array</span><span class="punctuation period">.</span><span class="hljs-property"><span class="hljs-keyword prototype">prototype</span></span><span class="punctuation period">.</span><span class="hljs-property">slice</span><span class="punctuation period">.</span><span class="hljs-title function_">apply</span><span class="punctuation parenthesis open-parenthesis">(</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-variable language_">document</span><span class="punctuation period">.</span><span class="hljs-title function_">querySelectorAll</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">ul.news-list</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation parenthesis close-parenthesis">)</span><br
><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation bracket open-bracket">[</span><span class="hljs-number">0</span><span class="punctuation bracket close-bracket">]</span><br
><span class="inline-pre-whitespaces indentation"><br
></span>newsThatAreNotNewsAnyMore<span class="punctuation period">.</span><span class="hljs-title function_">forEach</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-function"><span class="hljs-params">msg</span> <span class="punctuation arrow-function-sign">=></span></span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-keyword const">const</span> li <span class="punctuation equal-sign">=</span> <span class="hljs-variable language_">document</span><span class="punctuation period">.</span><span class="hljs-title function_">createElement</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">li</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation parenthesis close-parenthesis">)</span><br
><span class="inline-pre-whitespaces indentation"> </span>li<span class="punctuation period">.</span><span class="hljs-property">innerText</span> <span class="punctuation equal-sign">=</span> msg<br
><br
><span class="inline-pre-whitespaces indentation"> </span>ul<span class="punctuation period">.</span><span class="hljs-title function_">appendChild</span><span class="punctuation parenthesis open-parenthesis">(</span>li<span class="punctuation parenthesis close-parenthesis">)</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><span class="punctuation parenthesis close-parenthesis">)</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-variable language_">console</span><span class="punctuation period">.</span><span class="hljs-title function_">log</span><span class="punctuation parenthesis open-parenthesis">(</span><br
><span class="inline-pre-whitespaces indentation"> </span>newsThatAreNotNewsAnyMore<span class="punctuation period">.</span><span class="hljs-property">length</span><span class="punctuation comma">,</span><br
><span class="inline-pre-whitespaces indentation"> </span>newsThatAreNotNewsAnyMore<span class="punctuation period">.</span><span class="hljs-title function_">join</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-string empty-string"><span class="string-quote string-open-quote">'</span><span class="string-body"></span><span class="string-quote string-close-quote">'</span></span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation period">.</span><span class="hljs-property">length</span><br
><span class="punctuation parenthesis close-parenthesis">)</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-keyword function">function</span> <span class="hljs-title function_">addTwoNumbers</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-params">a<span class="punctuation comma">,</span> b</span><span class="punctuation parenthesis close-parenthesis">)</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-keyword if">if</span> <span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-keyword typeof">typeof</span> a <span class="punctuation tripple-equal-signs">===</span> <span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">number</span><span class="string-quote string-close-quote">'</span></span> <span class="punctuation double-ampersands">&&</span> <span class="hljs-keyword typeof">typeof</span> b <span class="punctuation tripple-equal-signs">===</span> <span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">number</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation parenthesis close-parenthesis">)</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-keyword return">return</span> a <span class="punctuation plus-sign">+</span> b<br
><span class="inline-pre-whitespaces indentation"> </span><span class="punctuation curly-brace close-curly-brace">}</span><br
><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-keyword return">return</span> <span class="hljs-title class_">NaN</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-keyword async">async</span> <span class="hljs-keyword function">function</span> <span class="hljs-title function_">anAsyncFunction</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-params">something<span class="punctuation comma">,</span> <span class="punctuation period">.</span><span class="punctuation period">.</span><span class="punctuation period">.</span>anything</span><span class="punctuation parenthesis close-parenthesis">)</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-keyword await">await</span> <span class="hljs-keyword new">new</span> <span class="hljs-title class_">Promise</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-function"><span class="hljs-params">resolve</span> <span class="punctuation arrow-function-sign">=></span></span> <span class="hljs-built_in setTimeout">setTimeout</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-function"><span class="punctuation parenthesis open-parenthesis">(</span><span class="punctuation parenthesis close-parenthesis">)</span> <span class="punctuation arrow-function-sign">=></span></span> <span class="hljs-title function_">resolve</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation comma">,</span> <span class="hljs-number">123</span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation parenthesis close-parenthesis">)</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-keyword return">return</span> <span class="punctuation plus-sign">+</span><span class="hljs-title function_">prompt</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">now please input a number:</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation parenthesis close-parenthesis">)</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-keyword export">export</span> <span class="hljs-keyword default">default</span> <span class="hljs-keyword function">function</span> <span class="hljs-title function_">isAPromiseObject</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-params">input</span><span class="punctuation parenthesis close-parenthesis">)</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-comment">/*<br
><span class="inline-pre-whitespaces indentation"> </span>A multi-lined<br
><span class="inline-pre-whitespaces indentation"> </span>comment<br
><span class="inline-pre-whitespaces indentation"> </span>with indentations<br
><span class="inline-pre-whitespaces indentation"> </span>looks like this.<br
><span class="inline-pre-whitespaces indentation"> </span>*/</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-keyword return">return</span> <span class="punctuation exclamation-marks even-count">!!</span>input <span class="punctuation double-ampersands">&&</span> <span class="hljs-keyword typeof">typeof</span> input<span class="punctuation period">.</span><span class="hljs-property">then</span> <span class="punctuation tripple-equal-signs">===</span> <span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">function</span><span class="string-quote string-close-quote">'</span></span> <span class="punctuation double-ampersands">&&</span> <span class="hljs-keyword typeof">typeof</span> input<span class="punctuation period">.</span><span class="hljs-property">done</span> <span class="punctuation tripple-equal-signs">===</span> <span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">function</span><span class="string-quote string-close-quote">'</span></span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-variable language_">module</span><span class="punctuation period">.</span><span class="hljs-property">exports</span> <span class="punctuation equal-sign">=</span> <span class="punctuation curly-brace open-curly-brace">{</span> <span class="hljs-attr">content</span><span class="punctuation colon">:</span> <span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">nothing</span><span class="string-quote string-close-quote">'</span></span> <span class="punctuation curly-brace close-curly-brace">}</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-built_in exports">exports</span><span class="punctuation period">.</span><span class="hljs-property">author</span> <span class="punctuation equal-sign">=</span> <span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">wulechun@live.com</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation semi-colon">;</span><br
></code></pre>
<h3 id="an-html-snippet" tabindex="-1"><a class="header-anchor" href="#an-html-snippet">§</a> An HTML Snippet</h3>
<pre><code class="hljs language-html"><span class="hljs-meta"><!DOCTYPE <span class="hljs-keyword">html</span>></span><br
><span class="hljs-tag"><<span class="hljs-name tag-name-html">html</span> <span class="hljs-attr tag-attribute-name-lang">lang</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"en-US"</span>></span><br
><span class="hljs-tag"><<span class="hljs-name tag-name-head">head</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-meta">meta</span> <span class="hljs-attr tag-attribute-name-charset">charset</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"UTF-8"</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-meta">meta</span> <span class="hljs-attr tag-attribute-name-name">name</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"viewport"</span> <span class="hljs-attr tag-attribute-name-content">content</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"width<span class="punctuation equal-sign">=</span>device-width<span class="punctuation comma">,</span> initial-scale<span class="punctuation equal-sign">=</span>1<span class="punctuation period">.</span>0"</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-meta">meta</span> <span class="hljs-attr tag-attribute-name-http-equiv">http-equiv</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"X-UA-Compatible"</span> <span class="hljs-attr tag-attribute-name-content">content</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"ie<span class="punctuation equal-sign">=</span>edge"</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-title">title</span>></span>Wulechuan's example document<span class="hljs-tag"></<span class="hljs-name">title</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-comment"><!-- A single line comment. --></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-style">style</span> <span class="hljs-attr tag-attribute-name-id">id</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"my-embedded-styles"</span>></span><span class="language-css"><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-selector-tag">div</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">width</span><span class="punctuation colon">:</span> <span class="hljs-number">100px</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">height</span><span class="punctuation colon">:</span> <span class="hljs-number">200px</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">border</span><span class="punctuation colon">:</span> <span class="hljs-number">6px</span> solid <span class="hljs-number">#888</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">border-radius</span><span class="punctuation colon">:</span> <span class="hljs-number">0.5em</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">box-shadow</span><span class="punctuation colon">:</span> <span class="hljs-number">0</span> <span class="hljs-number">0</span> <span class="hljs-number">0.5rem</span> <span class="hljs-number">0</span> <span class="hljs-built_in rgba">rgba</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-number">0</span><span class="punctuation comma">,</span> <span class="hljs-number">0</span><span class="punctuation comma">,</span> <span class="hljs-number">0</span><span class="punctuation comma">,</span> <span class="hljs-number">0.2</span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="punctuation curly-brace close-curly-brace">}</span><br
><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-selector-id"><span class="punctuation sharp-sign">#</span>app</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">display</span><span class="punctuation colon">:</span> flex<span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">position</span><span class="punctuation colon">:</span> relative<span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="punctuation curly-brace close-curly-brace">}</span><br
><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-selector-class"><span class="punctuation period">.</span>bg-view</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">filter</span><span class="punctuation colon">:</span> <span class="hljs-built_in blur">blur</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-number">16px</span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">transform</span><span class="punctuation colon">:</span> <span class="hljs-built_in scaleX">scaleX</span><span class="punctuation parenthesis open-parenthesis">(</span>-<span class="hljs-number">1</span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="punctuation curly-brace close-curly-brace">}</span><br
><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-selector-id"><span class="punctuation sharp-sign">#</span>cover</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span>backdrop-<span class="hljs-attribute">filter</span><span class="punctuation colon">:</span> <span class="hljs-built_in blur">blur</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-number">30px</span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="punctuation curly-brace close-curly-brace">}</span><br
><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-selector-class"><span class="punctuation period">.</span>box-1</span> <span class="punctuation curly-brace open-curly-brace">{</span> <span class="hljs-attribute">background-image</span><span class="punctuation colon">:</span> <span class="hljs-built_in url">url</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-string">'<span class="punctuation period">.</span>/images/beauties/beauty-1<span class="punctuation period">.</span>jpg'</span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span> <span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-selector-class"><span class="punctuation period">.</span>box-2</span> <span class="punctuation curly-brace open-curly-brace">{</span> <span class="hljs-attribute">background-image</span><span class="punctuation colon">:</span> <span class="hljs-built_in url">url</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-string">'<span class="punctuation period">.</span>/images/beauties/beauty-2<span class="punctuation period">.</span>jpg'</span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span> <span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-selector-class"><span class="punctuation period">.</span>box-3</span> <span class="punctuation curly-brace open-curly-brace">{</span> <span class="hljs-attribute">background-image</span><span class="punctuation colon">:</span> <span class="hljs-built_in url">url</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-string">'<span class="punctuation period">.</span>/images/beauties/beauty-3<span class="punctuation period">.</span>jpg'</span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span> <span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-selector-class"><span class="punctuation period">.</span>box-4</span> <span class="punctuation curly-brace open-curly-brace">{</span> <span class="hljs-attribute">background-image</span><span class="punctuation colon">:</span> <span class="hljs-built_in url">url</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-string">'<span class="punctuation period">.</span>/images/beauties/beauty-4<span class="punctuation period">.</span>jpg'</span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span> <span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"> </span></span><span class="hljs-tag"></<span class="hljs-name">style</span>></span><br
><span class="hljs-tag"></<span class="hljs-name">head</span>></span><br
><span class="hljs-tag"><<span class="hljs-name tag-name-body">body</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-article">article</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-h1">h1</span>></span>Welcome<span class="hljs-tag"></<span class="hljs-name">h1</span>></span><br
><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-p">p</span> <span class="hljs-attr tag-attribute-name-class">class</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"greeting"</span>></span>Hi everyone<span class="punctuation exclamation-marks odd-count">!</span> This is<br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-a">a</span> <span class="hljs-attr tag-attribute-name-target">target</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"_blank"</span> <span class="hljs-attr tag-attribute-name-href">href</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"mailto<span class="punctuation colon">:</span>wulechuan@live<span class="punctuation period">.</span>com"</span>></span>wulechuan<span class="hljs-tag"></<span class="hljs-name">a</span>></span>。<br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"></<span class="hljs-name">p</span>></span><br
><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-p">p</span> <span class="hljs-attr tag-attribute-name-id">id</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"lyric"</span>></span><span class="hljs-tag"><<span class="hljs-name tag-name-span">span</span> <span class="hljs-attr tag-attribute-name-class">class</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"content"</span>></span>Twinkle<span class="punctuation comma">,</span> Twinkle<span class="punctuation comma">,</span> Little Star<span class="hljs-tag"></<span class="hljs-name">span</span>></span><span class="hljs-tag"></<span class="hljs-name">p</span>></span><br
><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-ul">ul</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-li">li</span>></span><span class="hljs-tag"><<span class="hljs-name tag-name-span">span</span>></span>A<span class="hljs-tag"><<span class="hljs-name tag-name-em">em</span>></span>B<span class="hljs-tag"></<span class="hljs-name">em</span>></span>C<span class="hljs-tag"></<span class="hljs-name">span</span>></span><span class="hljs-tag"></<span class="hljs-name">li</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-li">li</span>></span><span class="hljs-tag"><<span class="hljs-name tag-name-span">span</span>></span>D<span class="hljs-tag"><<span class="hljs-name tag-name-em">em</span>></span>E<span class="hljs-tag"></<span class="hljs-name">em</span>></span>F<span class="hljs-tag"></<span class="hljs-name">span</span>></span><span class="hljs-tag"></<span class="hljs-name">li</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-li">li</span>></span><span class="hljs-tag"><<span class="hljs-name tag-name-span">span</span>></span>G<span class="hljs-tag"><<span class="hljs-name tag-name-em">em</span>></span>H<span class="hljs-tag"></<span class="hljs-name">em</span>></span>I<span class="hljs-tag"></<span class="hljs-name">span</span>></span><span class="hljs-tag"></<span class="hljs-name">li</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"></<span class="hljs-name">ul</span>></span><br
><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-p">p</span>></span>Lorem ipsum dolor<span class="punctuation comma">,</span> sit amet consectetur adipisicing elit<span class="punctuation period">.</span> Voluptatum<br
><span class="inline-pre-whitespaces indentation"> </span>perferendis similique minus recusandae numquam voluptates sequi soluta<br
><span class="inline-pre-whitespaces indentation"> </span>reiciendis<span class="punctuation period">.</span> Doloremque<span class="punctuation comma">,</span> dolorum ex<span class="punctuation exclamation-marks odd-count">!</span> Eaque voluptatem beatae ipsam<br
><span class="inline-pre-whitespaces indentation"> </span>eligendi ab fugiat laudantium facilis<span class="punctuation question-mark">?</span><span class="hljs-tag"></<span class="hljs-name">p</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"></<span class="hljs-name">article</span>></span><br
><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-comment"><!--<br
><span class="inline-pre-whitespaces indentation"> </span>A multi-lined comment<br
><span class="inline-pre-whitespaces indentation"> </span>looks like<br
><span class="inline-pre-whitespaces indentation"> </span>this.<br
><span class="inline-pre-whitespaces indentation"> </span>--></span><br
><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-div">div</span> <span class="hljs-attr tag-attribute-name-id">id</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"app"</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-button">button</span> <span class="hljs-attr tag-attribute-name-id">id</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"one-button"</span>></span>A Button<span class="hljs-tag"></<span class="hljs-name">button</span>></span><span class="hljs-tag"><<span class="hljs-name tag-name-br">br</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-img">img</span> <span class="hljs-attr tag-attribute-name-id">id</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"beauty"</span> <span class="hljs-attr tag-attribute-name-src">src</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"<span class="punctuation period">.</span>/images/beauties/beauty-1<span class="punctuation period">.</span>jpg"</span> <span class="hljs-attr tag-attribute-name-alt">alt</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"A beauty were here"</span> <span class="hljs-attr tag-attribute-name-tilte">tilte</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"A gorgeous lady"</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"></<span class="hljs-name">div</span>></span><br
><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-script">script</span> <span class="hljs-attr tag-attribute-name-id">id</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"js-example-1"</span> <span class="hljs-attr tag-attribute-name-type">type</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"text/javascript"</span>></span><span class="language-javascript"><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-keyword var">var</span> button <span class="punctuation equal-sign">=</span> <span class="hljs-variable language_">document</span><span class="punctuation period">.</span><span class="hljs-title function_">querySelector</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-string">'<span class="punctuation sharp-sign">#</span>one-button'</span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-keyword var">var</span> beautyImage <span class="punctuation equal-sign">=</span> <span class="hljs-variable language_">document</span><span class="punctuation period">.</span><span class="hljs-title function_">getElementById</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-string">'beauty'</span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span><br
><br
><span class="inline-pre-whitespaces indentation"> </span>button<span class="punctuation period">.</span><span class="hljs-property">onclick</span> <span class="punctuation equal-sign">=</span> <span class="hljs-keyword function">function</span> <span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-params"></span><span class="punctuation parenthesis close-parenthesis">)</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span>beautyImage<span class="punctuation period">.</span><span class="hljs-property">src</span> <span class="punctuation equal-sign">=</span> <span class="hljs-string">'<span class="punctuation period">.</span>/images/beauties/beauty-2<span class="punctuation period">.</span>jpg'</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span>beautyImage<span class="punctuation period">.</span><span class="hljs-property">title</span> <span class="punctuation equal-sign">=</span> <span class="hljs-string">'Another gorgeous lady'</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="punctuation curly-brace close-curly-brace">}</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span></span><span class="hljs-tag"></<span class="hljs-name">script</span>></span><br
><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-script">script</span> <span class="hljs-attr tag-attribute-name-id">id</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"js-example-2"</span> <span class="hljs-attr tag-attribute-name-async">async</span>></span><span class="language-javascript"><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-keyword const">const</span> girl <span class="punctuation equal-sign">=</span> <span class="hljs-variable language_">document</span><span class="punctuation period">.</span><span class="hljs-title function_">querySelector</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-string">'img'</span><span class="punctuation parenthesis close-parenthesis">)</span><br
><span class="inline-pre-whitespaces indentation"> </span>girl<span class="punctuation period">.</span><span class="hljs-title function_">addEventListener</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-string">'mouseover'</span><span class="punctuation comma">,</span> <span class="hljs-keyword function">function</span> <span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-params">event</span><span class="punctuation parenthesis close-parenthesis">)</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-variable language_">this</span><span class="punctuation period">.</span><span class="hljs-property">src</span> <span class="punctuation equal-sign">=</span> <span class="hljs-string">'<span class="punctuation period">.</span>/images/beauties/beauty-3<span class="punctuation period">.</span>jpg'</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-variable language_">this</span><span class="punctuation period">.</span><span class="hljs-property">title</span> <span class="punctuation equal-sign">=</span> <span class="hljs-string">'An amazingly beautifly girl'</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="punctuation curly-brace close-curly-brace">}</span><span class="punctuation parenthesis close-parenthesis">)</span><br
><span class="inline-pre-whitespaces indentation"> </span></span><span class="hljs-tag"></<span class="hljs-name">script</span>></span><br
><span class="hljs-tag"></<span class="hljs-name">body</span>></span><br
><span class="hljs-tag"></<span class="hljs-name">html</span>></span><br
></code></pre>
<h3 id="a-css-snippet" tabindex="-1"><a class="header-anchor" href="#a-css-snippet">§</a> A CSS Snippet</h3>
<pre><code class="hljs language-css"><span class="hljs-selector-tag">html</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">font-size</span><span class="punctuation colon">:</span> <span class="css-length"><span class="hljs-number">20</span><span class="css-unit length-unit absolute-length-unit px">px</span></span><span class="punctuation semi-colon">;</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-selector-tag">body</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">padding</span><span class="punctuation colon">:</span> <span class="css-length"><span class="hljs-number">3</span><span class="css-unit length-unit relative-length-unit rem">rem</span></span> <span class="css-length"><span class="hljs-number">1</span><span class="css-unit length-unit relative-length-unit rem">rem</span></span> <span class="css-length"><span class="hljs-number">4</span><span class="css-unit length-unit relative-length-unit rem">rem</span></span> <span class="css-length"><span class="hljs-number">1</span><span class="css-unit length-unit relative-length-unit rem">rem</span></span><span class="punctuation semi-colon">;</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-selector-tag">html</span><span class="punctuation comma">,</span> <span class="hljs-selector-tag">body</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">min-height</span><span class="punctuation colon">:</span> <span class="percentage-value"><span class="hljs-number">100</span><span class="punctuation percentage-sign">%</span></span><span class="punctuation semi-colon">;</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-selector-id"><span class="punctuation sharp-sign">#</span>app</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">display</span><span class="punctuation colon">:</span> flex<span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">position</span><span class="punctuation colon">:</span> relative<span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">width</span><span class="punctuation colon">:</span> <span class="percentage-value"><span class="hljs-number">100</span><span class="punctuation percentage-sign">%</span></span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">font-family</span><span class="punctuation colon">:</span> <span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">Microsoft YaHei UI</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation comma">,</span> <span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">Segoe UI</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation comma">,</span> <span class="hljs-built_in css-generic-font-family-name serif">serif</span><span class="punctuation semi-colon">;</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-selector-class"><span class="punctuation period">.</span>back-to-top</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">position</span><span class="punctuation colon">:</span> fixed<span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">display</span><span class="punctuation colon">:</span> block<span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">background-image</span><span class="punctuation colon">:</span> <span class="hljs-built_in">url</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">./images/black-rocket.png</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">width</span><span class="punctuation colon">:</span> <span class="css-length"><span class="hljs-number">1.5</span><span class="css-unit length-unit relative-length-unit rem">rem</span></span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">height</span><span class="punctuation colon">:</span> <span class="css-length"><span class="hljs-number">1.5</span><span class="css-unit length-unit relative-length-unit rem">rem</span></span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">overflow</span><span class="punctuation colon">:</span> hidden<span class="punctuation semi-colon">;</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-selector-tag">article</span><span class="punctuation comma">,</span> <span class="hljs-selector-class"><span class="punctuation period">.</span>article</span><span class="punctuation comma">,</span> <span class="hljs-selector-tag">p</span><span class="punctuation comma">,</span> <span class="hljs-selector-class"><span class="punctuation period">.</span>copywriting</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">color</span><span class="punctuation colon">:</span> <span class="hljs-built_in css-color-value css-named-color black">black</span><span class="punctuation semi-colon">;</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-selector-tag">a</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">color</span><span class="punctuation colon">:</span> <span class="hljs-built_in css-color-value css-named-color green">green</span><span class="punctuation semi-colon">;</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-selector-class"><span class="punctuation period">.</span>optional-line-break</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">display</span><span class="punctuation colon">:</span> block<span class="punctuation semi-colon">;</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-keyword at_media">@media</span> screen <span class="hljs-keyword and">and</span> <span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-attribute">max-width</span><span class="punctuation colon">:</span> <span class="css-length"><span class="hljs-number">600</span><span class="css-unit length-unit absolute-length-unit px">px</span></span><span class="punctuation parenthesis close-parenthesis">)</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-selector-class"><span class="punctuation period">.</span>optional-line-break</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">display</span><span class="punctuation colon">:</span> none<span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-selector-tag">a</span><span class="hljs-selector-pseudo"><span class="punctuation colon">:</span>hover</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">text-decoration-line</span><span class="punctuation colon">:</span> underline <span class="hljs-meta css-exclamation-important">!important</span><span class="punctuation semi-colon">;</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-selector-tag">a</span><span class="hljs-selector-attr">[href^=<span class="hljs-string">"#"</span><span class="punctuation bracket close-bracket">]</span></span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">color</span><span class="punctuation colon">:</span> <span class="hljs-built_in css-color-value css-named-color blue">blue</span><span class="punctuation semi-colon">;</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-keyword at_media">@media</span> <span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-attribute">max-width</span><span class="punctuation colon">:</span> <span class="css-length"><span class="hljs-number">900</span><span class="css-unit length-unit absolute-length-unit px">px</span></span><span class="punctuation parenthesis close-parenthesis">)</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-selector-tag">html</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">font-size</span><span class="punctuation colon">:</span> <span class="css-length"><span class="hljs-number">16</span><span class="css-unit length-unit absolute-length-unit px">px</span></span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="punctuation curly-brace close-curly-brace">}</span><br
><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-selector-tag">body</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">font-size</span><span class="punctuation colon">:</span> <span class="css-length"><span class="hljs-number">1</span><span class="css-unit length-unit relative-length-unit rem">rem</span></span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-selector-class"><span class="punctuation period">.</span>markdown-article</span><span class="punctuation comma">,</span><br
><span class="hljs-selector-class"><span class="punctuation period">.</span>markdown-article-toc</span><span class="punctuation comma">,</span><br
><span class="hljs-selector-class"><span class="punctuation period">.</span>markdown-article-back-to-top</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">display</span><span class="punctuation colon">:</span> block<span class="punctuation semi-colon">;</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-selector-class"><span class="punctuation period">.</span>markdown-article-back-to-top</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">border</span><span class="punctuation colon">:</span> <span class="css-length"><span class="hljs-number">1</span><span class="css-unit length-unit absolute-length-unit px">px</span></span> solid <span class="hljs-number color-hex-value"><span class="punctuation sharp-sign">#</span>778899</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">box-shadow</span><span class="punctuation colon">:</span> <span class="hljs-number">0</span> <span class="hljs-number">0</span> <span class="css-length"><span class="hljs-number">0.5</span><span class="css-unit length-unit relative-length-unit rem">rem</span></span> <span class="hljs-number">0</span> <span class="hljs-built_in">rgba</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-number">0</span><span class="punctuation comma">,</span> <span class="hljs-number">0</span><span class="punctuation comma">,</span> <span class="hljs-number">0</span><span class="punctuation comma">,</span> <span class="hljs-number">0.4</span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-keyword at_keyframes">@keyframes</span> fade-in <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="percentage-value"><span class="hljs-number">0</span><span class="punctuation percentage-sign">%</span></span> <span class="punctuation curly-brace open-curly-brace">{</span> <span class="hljs-attribute">opacity</span><span class="punctuation colon">:</span> <span class="hljs-number">0</span><span class="punctuation semi-colon">;</span> <span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="percentage-value"><span class="hljs-number">100</span><span class="punctuation percentage-sign">%</span></span> <span class="punctuation curly-brace open-curly-brace">{</span> <span class="hljs-attribute">opacity</span><span class="punctuation colon">:</span> <span class="hljs-number">1</span><span class="punctuation semi-colon">;</span> <span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-selector-class"><span class="punctuation period">.</span>my-container</span><span class="hljs-selector-pseudo"><span class="punctuation colon">:</span><span class="punctuation colon">:</span>before</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">content</span><span class="punctuation colon">:</span> <span class="hljs-string empty-string"><span class="string-quote string-open-quote">'</span><span class="string-body"></span><span class="string-quote string-close-quote">'</span></span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">display</span><span class="punctuation colon">:</span> block<span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">border-color</span><span class="punctuation colon">:</span> <span class="hljs-built_in css-color-value css-named-color black">black</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">background-color</span><span class="punctuation colon">:</span> <span class="hljs-built_in css-current-color">currentColor</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">text-indent</span><span class="punctuation colon">:</span> <span class="css-length"><span class="hljs-number"><span class="punctuation negative-sign">-</span>100</span><span class="css-unit length-unit absolute-length-unit px">px</span></span><span class="punctuation semi-colon">;</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-comment">/* chief navigation */</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-selector-tag">nav</span> <span class="hljs-selector-tag">ul</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">display</span><span class="punctuation colon">:</span> flex<span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">justify-content</span><span class="punctuation colon">:</span> space-around <span class="hljs-meta css-exclamation-important">!important</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">flex-wrap</span><span class="punctuation colon">:</span> wrap<span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">list-style</span><span class="punctuation colon">:</span> none<span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">padding</span><span class="punctuation colon">:</span> <span class="css-length"><span class="hljs-number">20</span><span class="css-unit length-unit absolute-length-unit px">px</span></span> <span class="css-length"><span class="hljs-number">10</span><span class="css-unit length-unit absolute-length-unit px">px</span></span><span class="punctuation semi-colon">;</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-selector-tag">nav</span> <span class="hljs-selector-tag">li</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">display</span><span class="punctuation colon">:</span> block<span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">padding</span><span class="punctuation colon">:</span> <span class="hljs-number">0</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">margin</span><span class="punctuation colon">:</span> <span class="css-length"><span class="hljs-number">10</span><span class="css-unit length-unit absolute-length-unit px">px</span></span> <span class="css-length"><span class="hljs-number">5</span><span class="css-unit length-unit absolute-length-unit px">px</span></span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">width</span><span class="punctuation colon">:</span> <span class="css-length"><span class="hljs-number">90</span><span class="css-unit length-unit absolute-length-unit px">px</span></span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">transition</span><span class="punctuation colon">:</span> all <span class="css-time-duration"><span class="hljs-number">0.4</span><span class="css-unit time-duration-unit">s</span></span> ease-out<span class="punctuation semi-colon">;</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-selector-class"><span class="punctuation period">.</span>disc</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">transform</span><span class="punctuation colon">:</span> <span class="hljs-built_in">rotate</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="css-angle"><span class="hljs-number">3.14159265</span><span class="css-unit angle-unit">rad</span></span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">transform</span><span class="punctuation colon">:</span> <span class="hljs-built_in">rotate</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="css-angle"><span class="hljs-number">180</span><span class="css-unit angle-unit">deg</span></span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">transform</span><span class="punctuation colon">:</span> <span class="hljs-built_in">rotate</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="css-angle"><span class="hljs-number">0.5</span><span class="css-unit angle-unit">turn</span></span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-comment">/* news list */</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-selector-class"><span class="punctuation period">.</span>news-list</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">font-size</span><span class="punctuation colon">:</span> <span class="css-length"><span class="hljs-number">1.2</span><span class="css-unit length-unit relative-length-unit rem">rem</span></span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">list-style</span><span class="punctuation colon">:</span> none<span class="punctuation semi-colon">;</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-selector-class"><span class="punctuation period">.</span>news-list</span> <span class="hljs-selector-tag">li</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">margin</span><span class="punctuation colon">:</span> <span class="css-length"><span class="hljs-number">0.15</span><span class="css-unit length-unit relative-length-unit em">em</span></span> auto<span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">padding</span><span class="punctuation colon">:</span> <span class="css-length"><span class="hljs-number">0.25</span><span class="css-unit length-unit relative-length-unit em">em</span></span> <span class="css-length"><span class="hljs-number">1</span><span class="css-unit length-unit relative-length-unit em">em</span></span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">background-color</span><span class="punctuation colon">:</span> <span class="hljs-number color-hex-value"><span class="punctuation sharp-sign">#</span>eee</span><span class="punctuation semi-colon">;</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-selector-class"><span class="punctuation period">.</span>news-list</span> <span class="hljs-selector-tag">li</span><span class="hljs-selector-pseudo"><span class="punctuation colon">:</span>nth-child</span><span class="punctuation parenthesis open-parenthesis">(</span>even<span class="punctuation parenthesis close-parenthesis">)</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">background-color</span><span class="punctuation colon">:</span> <span class="hljs-number color-hex-value"><span class="punctuation sharp-sign">#</span>d3d3d3</span><span class="punctuation semi-colon">;</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
></code></pre>
<h3 id="a-stylus(css)-snippet" tabindex="-1"><a class="header-anchor" href="#a-stylus(css)-snippet">§</a> A Stylus(CSS) Snippet</h3>
<pre><code class="hljs language-stylus">& <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">box-sizing</span><span class="punctuation colon">:</span> content-box <span class="hljs-meta css-exclamation-important">!important</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">max-width</span><span class="punctuation colon">:</span> articleBlockMaxWidth<span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">margin</span><span class="punctuation colon">:</span> auto<span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">line-height</span><span class="punctuation colon">:</span> <span class="hljs-number">1.5</span><span class="punctuation semi-colon">;</span><br
><br
><span class="inline-pre-whitespaces indentation"> </span>small <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">font-size</span><span class="punctuation colon">:</span> <span class="punctuation period">.</span><span class="css-length"><span class="hljs-number">707</span><span class="css-unit length-unit relative-length-unit em">em</span></span><span class="punctuation semi-colon">;</span> <span class="hljs-comment">// 想注释一下，但一时间觉得没啥好写的。</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">color</span> <span class="hljs-built_in css-color-value css-named-color blue">blue</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="punctuation curly-brace close-curly-brace">}</span><br
><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-selector-class"><span class="punctuation period">.</span>blue</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">color</span> <span class="hljs-built_in css-color-value css-named-color navy">navy</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="punctuation curly-brace close-curly-brace">}</span><br
><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-comment">/*<br
><span class="inline-pre-whitespaces indentation"> </span>A multi-lined comment,<br
><span class="inline-pre-whitespaces indentation"> </span>looks<br
><span class="inline-pre-whitespaces indentation"> </span>like this.<br
><span class="inline-pre-whitespaces indentation"> </span>*/</span><br
><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-selector-tag">h1</span><span class="punctuation comma">,</span> <span class="hljs-selector-tag">h2</span><span class="punctuation comma">,</span> <span class="hljs-selector-tag">h3</span><span class="punctuation comma">,</span> <span class="hljs-selector-tag">h4</span><span class="punctuation comma">,</span> <span class="hljs-selector-tag">h5</span><span class="punctuation comma">,</span> <span class="hljs-selector-tag">h6</span><span class="punctuation comma">,</span> <span class="hljs-selector-tag">dt</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">padding</span><span class="punctuation colon">:</span> <span class="css-length"><span class="hljs-number">0.5</span><span class="css-unit length-unit relative-length-unit rem">rem</span></span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">margin-left</span><span class="punctuation colon">:</span> <span class="css-length"><span class="hljs-number"><span class="punctuation negative-sign">-</span>0.5</span><span class="css-unit length-unit relative-length-unit rem">rem</span></span><span class="punctuation semi-colon">;</span> <span class="hljs-comment">// Compensation to the padding-left</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">margin-right</span><span class="punctuation colon">:</span> <span class="css-length"><span class="hljs-number"><span class="punctuation negative-sign">-</span>0.5</span><span class="css-unit length-unit relative-length-unit rem">rem</span></span><span class="punctuation semi-colon">;</span> <span class="hljs-comment">// Compensation to the padding-right</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="punctuation curly-brace close-curly-brace">}</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
></code></pre>
<h3 id="xml-snippet" tabindex="-1"><a class="header-anchor" href="#xml-snippet">§</a> XML Snippet</h3>
<p>From a keyboard mapping configuration file of SOFTIMAGE|XSI.</p>
<pre><code class="hljs language-xml"><span class="hljs-meta"><?xml version=<span class="hljs-string">"1.0"</span> encoding<span class="punctuation equal-sign">=</span><span class="hljs-string">"iso-8859-1"</span><span class="punctuation question-mark">?</span>></span><br
><span class="hljs-tag"><<span class="hljs-name tag-name-xsi_file">xsi_file</span> <span class="hljs-attr tag-attribute-name-type">type</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"Keymap"</span> <span class="hljs-attr tag-attribute-name-xsi_version">xsi_version</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"9<span class="punctuation period">.</span>5<span class="punctuation period">.</span>184<span class="punctuation period">.</span>0"</span> <span class="hljs-attr tag-attribute-name-syntax_version">syntax_version</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"1<span class="punctuation period">.</span>0"</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-keymap">keymap</span> <span class="hljs-attr tag-attribute-name-name">name</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"lechuan_si2011SAP_default"</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-keylist">keylist</span> <span class="hljs-attr tag-attribute-name-name">name</span><span class="punctuation equal-sign">=</span><span class="hljs-string">""</span> <span class="hljs-attr tag-attribute-name-guid">guid</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"<span class="punctuation curly-brace open-curly-brace">{</span>00000000-0000-0000-0000-000000000000<span class="punctuation curly-brace close-curly-brace">}</span>"</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-key">key</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-name">name</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"Help"</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-key">key</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"VK_F1"</span>></span><span class="hljs-tag"></<span class="hljs-name">key</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-key">key</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-name">name</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"Save Scene"</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-key">key</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"S"</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-modifier">modifier</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"DSCMD_CTRL"</span>></span><span class="hljs-tag"></<span class="hljs-name">key</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"></<span class="hljs-name">keylist</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-keylist">keylist</span> <span class="hljs-attr tag-attribute-name-name">name</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"AM Transition Tool"</span> <span class="hljs-attr tag-attribute-name-guid">guid</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"<span class="punctuation curly-brace open-curly-brace">{</span>4E7133BE-503D-41A2-84F8-48CA38BFAAAC<span class="punctuation curly-brace close-curly-brace">}</span>"</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-key">key</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-name">name</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"Switch to Bridge transition"</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-key">key</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"B"</span>></span><span class="hljs-tag"></<span class="hljs-name">key</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-key">key</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-name">name</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"Switch to Cardinal transition"</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-key">key</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"C"</span>></span><span class="hljs-tag"></<span class="hljs-name">key</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-key">key</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-name">name</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"Switch to Standard transition"</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-key">key</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"T"</span>></span><span class="hljs-tag"></<span class="hljs-name">key</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-keylist">keylist</span> <span class="hljs-attr tag-attribute-name-name">name</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"AM Transition Tool"</span> <span class="hljs-attr tag-attribute-name-guid">guid</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"<span class="punctuation curly-brace open-curly-brace">{</span>4E7133BE-503D-41A2-84F8-48CA38BFAAAC<span class="punctuation curly-brace close-curly-brace">}</span>"</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"></<span class="hljs-name">keylist</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-keylist">keylist</span> <span class="hljs-attr tag-attribute-name-name">name</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"XSI"</span> <span class="hljs-attr tag-attribute-name-guid">guid</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"<span class="punctuation curly-brace open-curly-brace">{</span>50830560-31B5-11D0-82E7-00A0243E268D<span class="punctuation curly-brace close-curly-brace">}</span>"</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-key">key</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-name">name</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"Frame All"</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-key">key</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"A"</span>></span><span class="hljs-tag"></<span class="hljs-name">key</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-key">key</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-name">name</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"Frame Selection"</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-key">key</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"F"</span>></span><span class="hljs-tag"></<span class="hljs-name">key</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-key">key</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-name">name</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"Navigate Tool"</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-key">key</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"S"</span>></span><span class="hljs-tag"></<span class="hljs-name">key</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-key">key</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-name">name</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"Raycast Polygon Select Tool"</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-key">key</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"U"</span>></span><span class="hljs-tag"></<span class="hljs-name">key</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-key">key</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-name">name</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"Select Parent in Branch"</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-key">key</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"VK_UP"</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-modifier">modifier</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"DSCMD_CTRL<span class="punctuation pipe">|</span>DSCMD_ALT"</span>></span><span class="hljs-tag"></<span class="hljs-name">key</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-key">key</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-name">name</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"Select Tree"</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-key">key</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"T"</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-modifier">modifier</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"DSCMD_ALT"</span>></span><span class="hljs-tag"></<span class="hljs-name">key</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-key">key</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-name">name</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"Subdivide"</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-key">key</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"D"</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-modifier">modifier</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"DSCMD_SHIFT"</span>></span><span class="hljs-tag"></<span class="hljs-name">key</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-key">key</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-name">name</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"Switch to Model Toolbar"</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-key">key</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"1"</span>></span><span class="hljs-tag"></<span class="hljs-name">key</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-key">key</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-name">name</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"Switch to Animate Toolbar"</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-key">key</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"2"</span>></span><span class="hljs-tag"></<span class="hljs-name">key</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-key">key</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-name">name</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"Switch to Render Toolbar"</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-key">key</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"3"</span>></span><span class="hljs-tag"></<span class="hljs-name">key</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-key">key</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-name">name</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"Switch to ICE Toolbar"</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-key">key</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"4"</span>></span><span class="hljs-tag"></<span class="hljs-name">key</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-key">key</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-name">name</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"Switch to Simulate Toolbar"</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-key">key</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"4"</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-modifier">modifier</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"DSCMD_CTRL"</span>></span><span class="hljs-tag"></<span class="hljs-name">key</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-key">key</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-name">name</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"Scaling Tool"</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-key">key</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"X"</span>></span><span class="hljs-tag"></<span class="hljs-name">key</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-key">key</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-name">name</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"Translate Tool"</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-key">key</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"V"</span>></span><span class="hljs-tag"></<span class="hljs-name">key</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-key">key</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-name">name</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"Rotation Tool"</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-key">key</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"C"</span>></span><span class="hljs-tag"></<span class="hljs-name">key</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-key">key</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-name">name</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"Undo"</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-key">key</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"Z"</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-modifier">modifier</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"DSCMD_ALT<span class="punctuation pipe">|</span>DSCMD_SHIFT"</span>></span><span class="hljs-tag"></<span class="hljs-name">key</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"></<span class="hljs-name">keylist</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"></<span class="hljs-name">keymap</span>></span><br
><span class="hljs-tag"></<span class="hljs-name">xsi_file</span>></span><br
></code></pre>
<h2 id="table" tabindex="-1"><a class="header-anchor" href="#table">§</a> Table</h2>
<h3 id="a-table" tabindex="-1"><a class="header-anchor" href="#a-table">§</a> A Table</h3>
<table>
<thead>
<tr>
<th style="text-align:right">Key</th>
<th>Value</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align:right">Name</td>
<td>Wulechuan</td>
</tr>
<tr>
<td style="text-align:right">Gender</td>
<td>Male</td>
</tr>
<tr>
<td style="text-align:right">Birth Year</td>
<td>1979</td>
</tr>
<tr>
<td style="text-align:right">Hometown</td>
<td>Nanchang, China</td>
</tr>
<tr>
<td style="text-align:right">Loved</td>
<td><code>SOFTIMAGE|XSI</code></td>
</tr>
</tbody>
</table>
<h3 id="another-table%2C-which-contains-code-snippets" tabindex="-1"><a class="header-anchor" href="#another-table%2C-which-contains-code-snippets">§</a> Another Table, Which Contains Code Snippets</h3>
<table>
<thead>
<tr>
<th style="width: 7em;">A</th>
<th>B</th>
</tr>
</thead>
<tbody>
<tr>
<td>
Javascript
</td>
<td>
<pre><code class="hljs language-javascript"><span class="hljs-keyword const">const</span> aSnippetInsideATable <span class="punctuation equal-sign">=</span> <span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">hello</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation semi-colon">;</span><br
></code></pre>
</td>
</tr>
<tr>
<td>
CSS
</td>
<td>
<pre><code class="hljs language-css"><span class="hljs-selector-class"><span class="punctuation period">.</span>wulechuan</span> <span class="punctuation curly-brace open-curly-brace">{</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attribute">color</span><span class="punctuation colon">:</span> <span class="hljs-number color-hex-value"><span class="punctuation sharp-sign">#</span>790319</span><span class="punctuation semi-colon">;</span><br
><span class="punctuation curly-brace close-curly-brace">}</span><br
></code></pre>
</td>
</tr>
<tr>
<td>
regular text
</td>
<td>
<h4>This is a sub title inside a table cell</h4>
<p>Irure aute aute aute ullamco deserunt deserunt cupidatat amet tempor eiusmod do ut quis qui. Nostrud esse irure pariatur ad aute ullamco sit reprehenderit magna. In aute enim qui veniam pariatur consectetur nulla ipsum consequat.</p>
</td>
</tr>
</tbody>
</table>
</article>
<nav class="markdown-article-toc"><ul><li><a href="#articles"> Articles</a><ul><li><a href="#linkages"> Linkages</a></li><li><a href="#lists"> Lists</a></li><li><a href="#inline-codes-in-multiple-lines"> Inline Codes in Multiple Lines</a></li><li><a href="#quoted-block"> Quoted Block</a><ul><li><a href="#what-is-github"> What is GitHub</a></li></ul></li><li><a href="#github"> GitHub</a></li></ul></li><li><a href="#illustrates(images)"> Illustrates(Images)</a><ul><li><a href="#a-normal-image"> A Normal Image</a></li><li><a href="#an-image-that-fails-to-load"> An Image that Fails to Load</a></li></ul></li><li><a href="#videos"> Videos</a></li><li><a href="#code-snippets"> Code Snippets</a><ul><li><a href="#a-javascript-snippet"> A JavaScript Snippet</a></li><li><a href="#an-html-snippet"> An HTML Snippet</a></li><li><a href="#a-css-snippet"> A CSS Snippet</a></li><li><a href="#a-stylus(css)-snippet"> A Stylus(CSS) Snippet</a></li><li><a href="#xml-snippet"> XML Snippet</a></li></ul></li><li><a href="#table"> Table</a><ul><li><a href="#a-table"> A Table</a></li><li><a href="#another-table%2C-which-contains-code-snippets"> Another Table, Which Contains Code Snippets</a></li></ul></li></ul></nav>
<a href="#" class="markdown-article-back-to-top"></a>
<script>
window.shouldShowOnlyTwoLevelsOfTOCItemsAtMost=!1,window.atBeginingShouldCollapseAllTOCItemsOfLevelsGreaterThan=1,window.atBeginingShouldExpandTOCWhenWindowIsWideEnough=!1,function(){const e=["https://gitee.com/nanchang-wulechuan/wulechuan-css-stylus-themes-for-htmls-via-markdowns.git","https://github.com/wulechuan/wulechuan-css-stylus-themes-for-htmls-via-markdowns.git"],n=e.reduce(((e,n)=>Math.max(e,n.length)),0)+0,t=Math.floor(n/2)+6,o="-".repeat(n),l="=".repeat(n),s="wulechuan@live.com",i="北京时间 2022-05-14",c=[];"中国人——特别是汉族人，理应坚持广泛、规范地使用汉语。凡非必要之情形不说外国话、不用外国字。此乃天经地义！\n然则每当必要，亦不排斥采用外国之语言。不妨博世界之学问，养中国之精神。\n本人亦支持少数民族坚持采用自己民族的传统语言。仍须强调，凡中国人，皆应会用汉语、积极使用汉语，此乃中华各民族之大一统之必由。".split("\n").forEach((e=>{c.push(""),c.push(" "+e.slice(0,t-4));let n=e.slice(t-4);for(;n.length>0;){const e=n.match(/^(，|。|！|，”|。”|！”| 》，|》。| 》！| 》，”| 》。”| 》！”)/);if(e){const t=e[1],o=c[c.length-1];c[c.length-1]=o+t,n=n.slice(t.length)}const o=n.slice(0,t);o&&c.push(o),n=n.slice(o.length)}})),console.log(`\n${l}\n\n%c欢迎使用吴乐川设计的用于“控制文章目录之交互”的控制器。%c\n（ Welcome to wulechuan's article TOC controller. ）\n\n${" ".repeat(n-s.length)}${s}\n${" ".repeat(n-i.length-3)}${i}\n\n${o}\n\n${e.join("\n")}\n\n${o}\n${c.join("\n")}\n\n${l}\n\n\n`,["font-family: sans-serif;","font-size: 1.25em;","display: inline-block;","vertical-align: baseline;","color: #000;","text-shadow: 0.5px 0.5px 2px rgba(0, 0, 0, 0.51);","background-color: #ffe0be;","border-radius: 3px;","margin: 0.5em 0;","padding: 0.5em 1em 0.5em 1.5em;"].join(""),null);const a="has-nested-toc-list",r="is-collapsed",d="is-expanded",h="markdown-article-toc-toggling-button",u=1e3,m=document.querySelector(".markdown-article");if(!m)return;const f=document.querySelector("nav.markdown-article-toc");if(!f)return;f.classList.toggle("should-show-2-levels-at-most",window.shouldShowOnlyTwoLevelsOfTOCItemsAtMost);const p=document.querySelector(".markdown-article-back-to-top");p&&(p.onclick=function(){if(!k())return;L(!1)}),m.onclick=function(){if(!(window.innerWidth<=u))return;L(!1)};const w=document.body,g=w,y=w;let S;y.classList.add("markdown-article-toc-exists"),function e(n,t){const o=n.querySelector("ol, ul");if(!o)return;t||(t=1);o.classList.add(`toc-list-level-${t}`);Array.prototype.slice.apply(o.children).filter((e=>"li"===e.tagName.toLowerCase())).forEach((n=>{n.tocLevelId=t,n.classList.add(`toc-list-level-${t}-item`),e(n,t+1)}))}(f),function(){let e;if(Array.prototype.slice.apply(f.querySelectorAll("li")).forEach((e=>{if(e.querySelectorAll("li").length>0){const n=e.querySelector("a");e.classList.add(a),e.hasNestedList=!0,e.isCollapsible=!1,e.selfAnchor=n,e.onclick=O}})),window.shouldShowOnlyTwoLevelsOfTOCItemsAtMost){const n=f.querySelector("ol, ul").children;e=n}else e=f.querySelectorAll("li.has-nested-toc-list");Array.prototype.slice.apply(e).forEach((e=>{e.isCollapsible=!0;A(e,e.tocLevelId<=window.atBeginingShouldCollapseAllTOCItemsOfLevelsGreaterThan)}))}(),function(){let e=document.querySelector(`.${h}`);e||(e=document.createElement("button"),e.className=h,g===w?g.insertBefore(e,document.scripts[0]):g.appendChild(e));null===e.onclick&&(e.onclick=v)}();let b="";function v(){L(!S)}function L(e){y.classList.toggle("markdown-article-toc-is-visible",e),S=e}function k(){return window.innerWidth<=600}function O(e){e.stopPropagation();const{srcElement:n}=e,t=this,{selfAnchor:o}=t;if(n!==t&&n!==o)return;const l=o.href;let s="";l.match(/#/)&&(s=`#${l.split("#").pop()}`);const i=!!s&&b!==s;b=s;let c=t.isCollapsible;if(k()&&(c=!1),c){const{classList:e}=t;A(t,e.contains(r)||i)}}function A(e,n){const{classList:t}=e;n?(t.contains(d)||t.add(d),t.contains(r)&&t.remove(r)):(t.contains(r)||t.add(r),t.contains(d)&&t.remove(d))}L(window.atBeginingShouldExpandTOCWhenWindowIsWideEnough&&window.innerWidth>=u)}(),Array.from(document.querySelectorAll("h1, h2, h3, h4, h5, h6")).forEach((e=>{const n=e.querySelector(".header-anchor");if(n){const t=n.nextSibling,o=t.nodeValue;if(/^ /.test(o)){const n=document.createElement("span");n.className="hidden-spacebar-between-head-linkage-and-head-text",n.innerHTML=" ",e.insertBefore(n,t),t.nodeValue=o.slice(1)}}}));
</script>
</body>
</html>