/
example.zh-hans-cn.default-dark-colored-theme.html
931 lines (929 loc) · 281 KB
/
example.zh-hans-cn.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
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
862
863
864
865
866
867
868
869
870
871
872
873
874
875
876
877
878
879
880
881
882
883
884
885
886
887
888
889
890
891
892
893
894
895
896
897
898
899
900
901
902
903
904
905
906
907
908
909
910
911
912
913
914
915
916
917
918
919
920
921
922
923
924
925
926
927
928
929
930
931
<!DOCTYPE html>
<html lang="zh-hans-CN">
<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>一篇由 Markdown 源文编译而得的网页(核心技术由 markdownIt 提供)</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="%E5%90%B4%E4%B9%90%E5%B7%9D%E7%9A%84%E6%96%87%E7%AB%A0%E9%BB%98%E8%AE%A4%E6%A0%B7%E5%BC%8F%E7%9A%84%E7%A4%BA%E4%BE%8B%E2%80%94%E2%80%94%E6%A0%B7%E5%BC%8F%E5%9D%87%E9%87%87%E7%94%A8-stylus-%E8%AF%AD%E8%A8%80%E7%BC%96%E5%86%99" tabindex="-1"><a class="header-anchor" href="#%E5%90%B4%E4%B9%90%E5%B7%9D%E7%9A%84%E6%96%87%E7%AB%A0%E9%BB%98%E8%AE%A4%E6%A0%B7%E5%BC%8F%E7%9A%84%E7%A4%BA%E4%BE%8B%E2%80%94%E2%80%94%E6%A0%B7%E5%BC%8F%E5%9D%87%E9%87%87%E7%94%A8-stylus-%E8%AF%AD%E8%A8%80%E7%BC%96%E5%86%99">§</a> 吴乐川的文章默认样式的示例<br><small>——样式均采用 stylus 语言编写</small></h1>
<p class="article-author">作者:吴乐川</p>
<hr>
<blockquote>
<p>中国人——特别是汉族人,理应坚持广泛、规范地使用汉语。凡非必要之情形不说外国话、不用外国字。此乃天经地义!然则每当必要,亦不排斥采用外国之语言。不妨 <strong>博世界之学问,养中国之精神</strong> 。</p>
<p>本人亦支持少数民族坚持采用自己民族的传统语言。仍须强调,凡中国人,皆应会用汉语、积极使用汉语,此乃中华各民族之大一统之必由。</p>
</blockquote>
<hr>
<h2 id="%E8%87%AA%E7%84%B6%E8%AF%AD%E8%A8%80%E8%8C%83%E6%96%87" tabindex="-1"><a class="header-anchor" href="#%E8%87%AA%E7%84%B6%E8%AF%AD%E8%A8%80%E8%8C%83%E6%96%87">§</a> 自然语言范文</h2>
<h3 id="%E3%80%8A%E5%8D%83%E5%AD%97%E6%96%87%E3%80%8B%5B%E8%8A%82%E9%80%89%5D" tabindex="-1"><a class="header-anchor" href="#%E3%80%8A%E5%8D%83%E5%AD%97%E6%96%87%E3%80%8B%5B%E8%8A%82%E9%80%89%5D">§</a> 《千字文》[节选]</h3>
<center>
<p>天地玄黄 宇宙洪荒<br>
日月盈昃 辰宿列张<br>
寒来暑往 秋收冬藏<br>
闰余成岁 律吕调阳<br>
云腾致雨 露结为霜<br>
金生丽水 玉出昆冈<br>
剑号巨阙 珠称夜光<br>
果珍李柰 菜重芥姜</p>
</center>
<h3 id="%E3%80%8A%E6%97%A5%E8%AE%B0%EF%BC%882019%E5%B9%B46%E6%9C%8818%E6%97%A5%EF%BC%89%E3%80%8B%5B%E8%8A%82%E9%80%89%5D" tabindex="-1"><a class="header-anchor" href="#%E3%80%8A%E6%97%A5%E8%AE%B0%EF%BC%882019%E5%B9%B46%E6%9C%8818%E6%97%A5%EF%BC%89%E3%80%8B%5B%E8%8A%82%E9%80%89%5D">§</a> 《日记(2019年6月18日)》[节选]</h3>
<p>出了家门,我二人在单元门的雨檐下站着,我左手挎着端儿的书包,双手用力把伞撑开。开伞时左臂自然会有些吃力,我于是小声嘟囔了一句:“这包这么重啊!现在的孩子(上)幼儿园就背这么多书!”</p>
<p>有道是言者无意,听者有心。我这随口一句话,端儿听了立刻很认真地说:“爸爸,(书包)给我背吧。我自己来背。”我推辞说:“没事儿,爸爸可以拿。”端儿又道:“爸爸,你一只手(拿),我两只手(指双肩)!我自己能行!”</p>
<p>“爸爸,你一只手,我两只手。”看似多么简单的一句话,我这当大人的却一下子感动了,只觉得一股暖流涌入心间。我也不再争了,顺他的意,帮着他把书包背好。</p>
<h3 id="%E5%94%90%E8%AF%97" tabindex="-1"><a class="header-anchor" href="#%E5%94%90%E8%AF%97">§</a> 唐诗</h3>
<center>
<h4 id="%E3%80%8A%E9%A9%AC%E8%AF%97%E4%BA%8C%E5%8D%81%E4%B8%89%E9%A6%96%C2%B7%E5%85%B6%E4%BA%94%E3%80%8B" tabindex="-1"><a class="header-anchor" href="#%E3%80%8A%E9%A9%AC%E8%AF%97%E4%BA%8C%E5%8D%81%E4%B8%89%E9%A6%96%C2%B7%E5%85%B6%E4%BA%94%E3%80%8B">§</a> 《马诗二十三首·其五》</h4>
<p><i>【唐】 李贺</i></p>
<p>大漠沙如雪<br>
燕山月似钩<br>
何当金络脑<br>
快走踏清秋</p>
</center>
<h3 id="%E6%9D%82%E4%B9%B1%E5%86%85%E5%AE%B9%EF%BC%8C%E4%BB%85%E7%94%A8%E4%BA%8E%E8%A7%86%E8%A7%89%E6%A0%B7%E5%BC%8F%E4%B9%8B%E5%91%88%E7%A4%BA" tabindex="-1"><a class="header-anchor" href="#%E6%9D%82%E4%B9%B1%E5%86%85%E5%AE%B9%EF%BC%8C%E4%BB%85%E7%94%A8%E4%BA%8E%E8%A7%86%E8%A7%89%E6%A0%B7%E5%BC%8F%E4%B9%8B%E5%91%88%E7%A4%BA">§</a> 杂乱内容,仅用于视觉样式之呈示</h3>
<p>一段文字中会有<strong>着重的文字</strong>,也会有<em>斜体的文字</em>,甚至 <em><strong>斜体且着重的文字</strong></em> 以及 <strong><em>着重且斜体的文字</em></strong>。</p>
<p>网页中的文章常常有【超链接】。我以前常常将代码存放在外国的GitHub上,如今则更倾向于采用中国的“码云”。“Github”一词,我本人有意将其译为【<a target="_blank" href="https://github.com">集得中心</a>】。当然,这并非官方译法,乃鄙人之拙见。</p>
<p>如果一个超链接指向<strong>本文</strong>某处,不妨称其为<strong>文内链接</strong>,而不应生硬地由英语直译为所谓“本地链接”。另,文内链接应与指向其它文章或网址的超链接在视觉表达上稍有不同,以为明示,这才好。小例一则:跳转至本文《<a href="#%E7%A8%8B%E5%BA%8F%E4%BB%A3%E7%A0%81%E7%89%87%E6%AE%B5%E7%A4%BA%E4%BE%8B%E9%9B%86">程序代码片段示例集</a>》。</p>
<p>再来看看行文中的【代码词汇】、【专有名词】和【术语】:例如<code>grep</code>、<code>孙行者</code>和<code>中央处理单元</code>。又如<code>querySelector</code>和<code>querySelectorAll</code>早已取代了老式的<code>getElementsById</code>等函数。术语框中的多个连续空格也应得到保留,例如<code>这后面有四个空格 这前面有四个空格</code>。</p>
<p>术语与超链接还可组合为一体。甚至与着重、斜体等效果进行组合。新中国的建立和成长离不开一群功勋卓著的科学家们。例如伟大的、富有爱国主义精神和民族自信的<a target="_blank" href="https://baike.baidu.com/item/%E9%92%B1%E5%AD%A6%E6%A3%AE/26105"><code>钱学森</code></a>,<strong>他是 <code>中国科学院资深院士</code>、 <code>中国工程院资深院士</code>。</strong> <em>他提出的<code>钱学森弹道</code>至今(2022年4月)仍是 <strong>无法拦截的</strong></em> !如今,我们在科技领域面临的两大钳制是 <em><strong>粮食<code>育种</code>技术</strong></em> 和 <strong><em>高性能<code>光刻机</code>制造技术</em></strong> 。</p>
<p>计算机键盘快捷键,其视觉样式如是:<kbd>Ctrl</kbd>+<kbd> </kbd>;又例:如今,<kbd>Ctrl</kbd>+<kbd>Shift</kbd>+<kbd>s</kbd>这一组合键早已广泛用于各种现代计算机软件中,代表(将工作内容或文件)<code>另存为</code>(壹文件)之功能。</p>
<p>还有些内容会故意“杠掉”,即被中划线划去,表示此内容不正确,不应采纳,应作废。例如:<s>地球是平的</s>。术语或专有名词也可以标记为废弃,例:非必要不用舶来词。不应称 <s><code>车厘子</code></s> ,而应称 <code>进口樱桃</code> 。不应称 <s><code>芝士</code></s> 、 <s><code>起司</code></s> ,而应称 <code>奶酪</code> 。还有两个作废的超链接: <s><a target="_blank" href="http://softimage.com/"><code>SOFTIMAGE.com</code></a></s> 和 <s><a href="#"><code>假设已经删除的章节的文内链接</code></a></s> 。</p>
<h4 id="%E5%A4%8D%E6%9D%82%E7%9A%84%E6%A0%B7%E5%BC%8F%E7%BB%84%E5%90%88" tabindex="-1"><a class="header-anchor" href="#%E5%A4%8D%E6%9D%82%E7%9A%84%E6%A0%B7%E5%BC%8F%E7%BB%84%E5%90%88">§</a> 复杂的样式组合</h4>
<p>再看几个“近乎终极”的组合效果——具有着重斜体强调的带有超链接的术语。为什么不止一个?因为 HTML 标签的嵌套组合是很灵活的,偏偏 MarkDown 的语法又允许制造出这几种组合。如下。</p>
<ul>
<li>
<p>着重符号(即星号与下划线)包裹在方括号外的效果:我们中国有 <strong><em>了不起的民营企业<a target="_blank" href="https://consumer.huawei.com/cn/"><code>华为</code></a>公司</em></strong> 或我们中国有 <em><strong>了不起的民营企业<a href="https://www.fuyaogroup.com/"><code>福耀玻璃</code></a>公司</strong></em>。</p>
<p>上例的 MarkDown 源码:</p>
<pre><code class="hljs language-md"><span class="hljs-strong">**<span class="hljs-emphasis">_了不起的民营企业<span class="punctuation bracket open-bracket">[</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 bracket close-bracket">]</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-link">https<span class="punctuation colon">:</span>//consumer<span class="punctuation period">.</span>huawei<span class="punctuation period">.</span>com/cn/</span><span class="punctuation parenthesis close-parenthesis">)</span>公司_</span>**</span><br
></code></pre>
<pre><code class="hljs language-md"><span class="hljs-emphasis">_<span class="hljs-strong">**了不起的民营企业<span class="punctuation bracket open-bracket">[</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 bracket close-bracket">]</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-link">https<span class="punctuation colon">:</span>//www<span class="punctuation period">.</span>fuyaogroup<span class="punctuation period">.</span>com/</span><span class="punctuation parenthesis close-parenthesis">)</span>公司**</span>_</span><br
></code></pre>
</li>
<li>
<p>着重符号(即星号与下划线)在方括号内:我们中国有 <a target="_blank" href="https://consumer.huawei.com/cn/"><strong><em>了不起的民营企业<code>华为</code>公司</em></strong></a> 或我们中国有 <a href="https://www.fuyaogroup.com/"><em><strong>了不起的民营企业<code>福耀玻璃</code>公司</strong></em></a>。</p>
<p>上例的 MarkDown 源码:</p>
<pre><code class="hljs language-md"><span class="punctuation bracket open-bracket">[</span><span class="hljs-string">**_了不起的民营企业_`华为`公司_**</span><span class="punctuation bracket close-bracket">]</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-link">https<span class="punctuation colon">:</span>//consumer<span class="punctuation period">.</span>huawei<span class="punctuation period">.</span>com/cn/</span><span class="punctuation parenthesis close-parenthesis">)</span><br
></code></pre>
<pre><code class="hljs language-md"><span class="punctuation bracket open-bracket">[</span><span class="hljs-string">_**_了不起的民营企业`福耀玻璃`公司**_</span><span class="punctuation bracket close-bracket">]</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-link">https<span class="punctuation colon">:</span>//www<span class="punctuation period">.</span>fuyaogroup<span class="punctuation period">.</span>com/</span><span class="punctuation parenthesis close-parenthesis">)</span><br
></code></pre>
</li>
</ul>
<p>不难看出,我的策略是任凭它如何组合,我总是令它们的视觉效果一致。因为我认为尽管文章作者处于任何原因采用了不一致的书写方式,但他意图达到的目的是相同的。</p>
<p>你以为这就完了?非也!倘若再加上删除线呢?那就更复杂了!例如:每每危难时刻,不论哪一个国家或地区,总有昧着良心的人在 <s><a target="_blank" href="https://baike.baidu.com/item/%E5%8F%91%E5%9B%BD%E9%9A%BE%E8%B4%A2/15514820"><strong><em><code>发国难财</code></em></strong></a></s> 、 <a href="https://baike.baidu.com/item/%E5%8F%91%E5%9B%BD%E9%9A%BE%E8%B4%A2/15514820"><s><strong><em><code>发国难财</code></em></strong></s></a> 、 <a href="https://baike.baidu.com/item/%E5%8F%91%E5%9B%BD%E9%9A%BE%E8%B4%A2/15514820"><strong><s><em><code>发国难财</code></em></s></strong></a> 或 <a href="https://baike.baidu.com/item/%E5%8F%91%E5%9B%BD%E9%9A%BE%E8%B4%A2/15514820"><strong><em><s><code>发国难财</code></s></em></strong></a> ,以及 <s><strong><em><a href="https://baike.baidu.com/item/%E5%8F%91%E5%9B%BD%E9%9A%BE%E8%B4%A2/15514820"><code>发国难财</code></a></em></strong></s> 、 <strong><s><em><a href="https://baike.baidu.com/item/%E5%8F%91%E5%9B%BD%E9%9A%BE%E8%B4%A2/15514820"><code>发国难财</code></a></em></s></strong> 或 <strong><em><s><a href="https://baike.baidu.com/item/%E5%8F%91%E5%9B%BD%E9%9A%BE%E8%B4%A2/15514820"><code>发国难财</code></a></s></em></strong> 。这些人终将受到历史的审判!</p>
<p>去掉超链接再试试:中国南宋时期有一个十恶不赦的奸佞宰相,名唤 <s><strong><em><code>秦桧</code></em></strong></s> 、 <strong><s><em><code>秦桧</code></em></s></strong> 、 <strong><em><s><code>秦桧</code></s></em></strong> 或 <em><strong><s><code>秦桧</code></s></strong></em> ,他陷害了<em>爱国将领 <a target="_blank" href="https://baike.baidu.com/item/%E5%B2%B3%E9%A3%9E/127844"><code>岳飞</code></a></em> 。</p>
<blockquote>
<p>注:排列组合的可能性太多,示例不一而足。</p>
</blockquote>
<h4 id="%E9%A1%BB%E7%9F%A5%E7%9D%80%E9%87%8D%E6%88%96%E5%BC%BA%E8%B0%83%E4%B9%83%E8%87%B3%E4%BD%9C%E5%BA%9F%E7%9A%84%E6%96%87%E5%AD%97%E4%BB%A5%E5%8F%8A%E4%B8%93%E6%9C%89%E5%90%8D%E8%AF%8D%E4%BA%A6%E5%8F%AF%E8%83%BD%E5%87%BA%E7%8E%B0%E5%9C%A8%E6%A0%87%E9%A2%98%E4%B8%AD" tabindex="-1"><a class="header-anchor" href="#%E9%A1%BB%E7%9F%A5%E7%9D%80%E9%87%8D%E6%88%96%E5%BC%BA%E8%B0%83%E4%B9%83%E8%87%B3%E4%BD%9C%E5%BA%9F%E7%9A%84%E6%96%87%E5%AD%97%E4%BB%A5%E5%8F%8A%E4%B8%93%E6%9C%89%E5%90%8D%E8%AF%8D%E4%BA%A6%E5%8F%AF%E8%83%BD%E5%87%BA%E7%8E%B0%E5%9C%A8%E6%A0%87%E9%A2%98%E4%B8%AD">§</a> 须知<strong>着重</strong>或<em>强调</em>乃至<s>作废</s>的文字以及<code>专有名词</code>亦可能出现在标题中</h4>
<p>上善若水,水善利万物而不争。</p>
<h4 id="%E5%A4%9A%E7%BA%A7%E5%88%97%E8%A1%A8%E4%B9%8B%E7%A4%BA%E8%8C%83" tabindex="-1"><a class="header-anchor" href="#%E5%A4%9A%E7%BA%A7%E5%88%97%E8%A1%A8%E4%B9%8B%E7%A4%BA%E8%8C%83">§</a> 多级列表之示范</h4>
<ol>
<li>
<p>第 1 级第 1 项</p>
</li>
<li>
<p>第 1 级第 2 项</p>
<ol>
<li>西施,约 2522 岁</li>
<li>王昭君,2070 岁</li>
<li>貂蝉,约 1820 岁</li>
<li>杨玉环,1300 岁</li>
<li>你媳妇儿,永远 20 岁</li>
</ol>
</li>
<li>
<p>第 1 级第 3 项</p>
<ul>
<li>周瑜正式出任新航母舰长</li>
<li>岳鹏举在南方各地视察防御工事</li>
<li>祖冲之发表全新论文,受到中科院表彰</li>
<li>武松打虎一案受到自然保护主义者质疑,有关部门已正式展开调查</li>
<li>李广在 2019 亚洲射箭锦标赛再次夺魁</li>
</ul>
</li>
<li>
<p>第 1 级第 4 项</p>
</li>
<li>
<p>第 1 级第 5 项</p>
<ul>
<li>
<p>第 2 级第 1 项</p>
</li>
<li>
<p>第 2 级第 2 项</p>
</li>
<li>
<p>第 2 级第 3 项</p>
<ul>
<li>甲:李哪吒</li>
<li>乙:敖丙</li>
<li>丙:李靖</li>
<li>丁:殷夫人</li>
<li>戊:太乙真人</li>
<li>己:申公豹</li>
<li>庚:东海龙王</li>
<li>辛:元始天尊</li>
<li>壬:巡海夜叉</li>
<li>癸:长生云</li>
</ul>
</li>
</ul>
</li>
<li>
<p>第 1 级第 6 项。“<code>81192</code>,收到请返航。”</p>
</li>
</ol>
<h3 id="%E5%A4%9A%E7%BA%A7%E6%A0%87%E9%A2%98%EF%BC%88%E8%BF%99%E6%98%AF-%3Ch3%3E%EF%BC%89" tabindex="-1"><a class="header-anchor" href="#%E5%A4%9A%E7%BA%A7%E6%A0%87%E9%A2%98%EF%BC%88%E8%BF%99%E6%98%AF-%3Ch3%3E%EF%BC%89">§</a> 多级标题(这是 <h3>)</h3>
<h4 id="%E5%8A%A8%E7%94%BB%E7%89%87%E3%80%8A%E4%B9%9D%E8%89%B2%E9%B9%BF%E3%80%8B%EF%BC%88%E8%BF%99%E6%98%AF-%3Ch4%3E%EF%BC%89" tabindex="-1"><a class="header-anchor" href="#%E5%8A%A8%E7%94%BB%E7%89%87%E3%80%8A%E4%B9%9D%E8%89%B2%E9%B9%BF%E3%80%8B%EF%BC%88%E8%BF%99%E6%98%AF-%3Ch4%3E%EF%BC%89">§</a> 动画片《九色鹿》(这是 <h4>)</h4>
<p>《九色鹿》是根据敦煌壁画《鹿王本生》故事改编,由中国上海美术电影制片厂 1981 年出品的动画美术作品。由钱家骏、戴铁郎担任导演,潘絜兹任编剧。该片采用敦煌壁画的形式,用中国古代佛教绘画的风格讲述了九色鹿经常帮助遇到困难的人,在帮助过弄蛇人后,弄蛇人向国王告密出卖九色鹿,九色鹿用神力化险,弄蛇人受到应有报应的故事。</p>
<h4 id="web-api-%E5%8F%AF%E4%BB%A5%E5%88%86%E4%B8%BA%E5%BE%88%E5%A4%9A%E7%B1%BB%EF%BC%88%E8%BF%99%E6%98%AF-%3Ch4%3E%EF%BC%89" tabindex="-1"><a class="header-anchor" href="#web-api-%E5%8F%AF%E4%BB%A5%E5%88%86%E4%B8%BA%E5%BE%88%E5%A4%9A%E7%B1%BB%EF%BC%88%E8%BF%99%E6%98%AF-%3Ch4%3E%EF%BC%89">§</a> Web API 可以分为很多类(这是 <h4>)</h4>
<h5 id="%E5%81%87%E5%A6%82%E6%9F%90%E6%A0%87%E9%A2%98%E9%9D%9E%E5%B8%B8%E9%95%BF%EF%BC%8C%E5%88%99%E8%AF%A5%E6%A0%87%E9%A2%98%E5%8F%AF%E8%83%BD%E6%8A%98%E8%A1%8C%EF%BC%8C%E5%8D%B3%E5%8D%A0%E6%8D%AE%E5%A4%9A%E8%A1%8C%EF%BC%8C%E5%B0%A4%E5%85%B6%E6%98%AF%E5%9C%A8%E7%AA%84%E5%B0%8F%E7%9A%84%E6%B5%8F%E8%A7%88%E5%99%A8%E7%AA%97%E5%8F%A3%E4%B8%AD%EF%BC%88%E8%BF%99%E6%98%AF-%3Ch5%3E%EF%BC%89" tabindex="-1"><a class="header-anchor" href="#%E5%81%87%E5%A6%82%E6%9F%90%E6%A0%87%E9%A2%98%E9%9D%9E%E5%B8%B8%E9%95%BF%EF%BC%8C%E5%88%99%E8%AF%A5%E6%A0%87%E9%A2%98%E5%8F%AF%E8%83%BD%E6%8A%98%E8%A1%8C%EF%BC%8C%E5%8D%B3%E5%8D%A0%E6%8D%AE%E5%A4%9A%E8%A1%8C%EF%BC%8C%E5%B0%A4%E5%85%B6%E6%98%AF%E5%9C%A8%E7%AA%84%E5%B0%8F%E7%9A%84%E6%B5%8F%E8%A7%88%E5%99%A8%E7%AA%97%E5%8F%A3%E4%B8%AD%EF%BC%88%E8%BF%99%E6%98%AF-%3Ch5%3E%EF%BC%89">§</a> 假如某标题非常长,则该标题可能折行,即占据多行,尤其是在窄小的浏览器窗口中(这是 <h5>)</h5>
<p>文档对象模型(DOM)将 web 页面与到脚本或编程语言连接起来。通常是指 JavaScript,但将 HTML、SVG 或 XML 文档建模为对象并不是 JavaScript 语言的一部分。DOM 模型用一个逻辑树来表示一个文档,树的每个分支的终点都是一个节点(node),每个节点都包含着对象(object)。DOM 的方法(method)让你可以用特定方式操作这个树,用这些方法你可以改变文档的结构、样式或者内容。节点可以关联上事件处理器,一旦某一事件被触发了,那些事件处理器就会被执行。<sup>[1]</sup></p>
<h5 id="%E5%B1%82%E5%8F%A0%E6%A0%B7%E5%BC%8F%E8%A1%A8%E5%AF%B9%E8%B1%A1%E6%A8%A1%E5%9E%8B%EF%BC%88%E8%BF%99%E6%98%AF-%3Ch5%3E%EF%BC%89" tabindex="-1"><a class="header-anchor" href="#%E5%B1%82%E5%8F%A0%E6%A0%B7%E5%BC%8F%E8%A1%A8%E5%AF%B9%E8%B1%A1%E6%A8%A1%E5%9E%8B%EF%BC%88%E8%BF%99%E6%98%AF-%3Ch5%3E%EF%BC%89">§</a> 层叠样式表对象模型(这是 <h5>)</h5>
<p>CSS Object Model 是一组允许用 JavaScript 操纵 CSS 的 API。 它是继 DOM 和 HTML API 之后,又一个操纵 CSS 的接口,使得我们能够动态地读取和修改 CSS 样式。<sup>[2]</sup></p>
<h5 id="%E5%BC%95%E7%94%A8%E6%9D%A5%E6%BA%90%EF%BC%88%E8%BF%99%E6%98%AF-h5%EF%BC%89" tabindex="-1"><a class="header-anchor" href="#%E5%BC%95%E7%94%A8%E6%9D%A5%E6%BA%90%EF%BC%88%E8%BF%99%E6%98%AF-h5%EF%BC%89">§</a> 引用来源(这是 h5)</h5>
<blockquote>
<p>上文[1]来自 <a target="_blank" href="https://developer.mozilla.org/zh-CN/documents/Web/API/Document_Object_Model">MDN</a>,但故意没有作为引用段落,以便呈现正常段落文字的样貌。</p>
</blockquote>
<blockquote>
<p>上文[2]来自 <a target="_blank" href="https://developer.mozilla.org/zh-CN/documents/Web/API/CSS_Object_Model">MDN</a>,但故意没有作为引用段落,以便呈现正常段落文字的样貌。</p>
</blockquote>
<hr>
<h3 id="%E5%BC%95%E7%94%A8%E7%9A%84%E6%96%87%E5%AD%97" tabindex="-1"><a class="header-anchor" href="#%E5%BC%95%E7%94%A8%E7%9A%84%E6%96%87%E5%AD%97">§</a> 引用的文字</h3>
<p>我们还可以引用一小段文字。例如,子曰:</p>
<blockquote>
<p>学而时习之 不亦说乎 有朋自远方来 不亦乐乎 人不知而不愠 不亦君子乎</p>
</blockquote>
<p>由上例可以看出,如果引用的文字恰好仅为单一自然段,我故意采用 CSS 选择器识别之,并免去了段首的两个空格。不过,假如引用内容块内的自然段超过一段,则各段首的空格是保留的,除非某自然段的文字排列方案是“居中”或“居右”。即,凡居中或居右者,段首总是没有空格的。见下例。</p>
<blockquote>
<p>时间要打多久,我讲我们不要做决定。过去是由杜鲁门,以后是由艾森豪威尔,或者是美国的将来的什么总统,由他们去决定。就是说他们要打多久就打多久!一直打到完全胜利!</p>
<p class="texts-align-rightwards">——毛泽东</p>
</blockquote>
<p>如果引用的文字很短,我目前的设计是令它们位于同一行中。例如:</p>
<blockquote>
<p>circle ['sɜrk(ə)l] <i>n.</i> 圆。</p>
</blockquote>
<blockquote>
<p>area ['eriə] <i>n.</i> 面积。</p>
</blockquote>
<ul>
<li>
<p>出现在列表项中的引用文字:</p>
<p>复旦大学中国研究院院长<a target="_blank" href="https://baike.baidu.com/item/%E5%BC%A0%E7%BB%B4%E4%B8%BA/2650478">张维为</a>教授在其所著《中国超越:一个文明型国家的光荣与梦想》中写道:</p>
<blockquote>
<p>中国人的爱国主义是长江、黄河、珠穆朗玛峰;是《诗经》、《楚辞》、先秦散文;是唐诗、宋词、元曲、明清小说;是屈原、岳飞、文天祥、毛泽东;是普通话、四川话、广东粤语、上海方言;是万里长城、北京故宫、桂林山水、陕西兵马俑;是川菜、粤菜、鲁菜、淮扬菜;是西湖龙井、黄山毛峰、武夷岩茶、洞庭碧螺春;是《梅花三弄》、《高山流水》、《二泉映月》、《春江花月夜》;是四合院、广东骑楼、徽派大院、江南民居;是昆剧、京剧、粤剧、黄梅戏;是南昌起义、平型关大捷、台儿庄血战、抗美援朝;是两弹一星、北斗导航、神舟号飞船、高铁八纵八横;是己所不欲,勿施于人;是四海之内皆兄弟;是胸怀祖国,放眼世界等等等等。</p>
</blockquote>
</li>
<li>
<blockquote>
<p>师父,俺老孙来也!</p>
</blockquote>
</li>
</ul>
<p>引用的文字中有时也会有较复杂的版式,见下例。</p>
<blockquote>
<h4 id="softimage%7Cxsi" tabindex="-1"><a class="header-anchor" href="#softimage%7Cxsi">§</a> SOFTIMAGE|XSI</h4>
<p>坐落于加拿大蒙特利尔的 SOFTIMAGE Co. 公司曾是计算机画面制作工具行业的顶尖力量。多年来,该公司几经易主,母公司先后有微软(Microsoft)公司、Avid 公司,以及最终的欧特克(Autodesk)公司。</p>
<p>早年,SOFTIMAGE 公司旗下三维动画制作软件 SOFTIMAGE|3D 曾经好莱坞业界最尖端的三维动画工具。1993 年公映的著名电影《侏罗纪公园》,其中的恐龙形象全部由该工具制作完成。</p>
<p>2000 年,SOFTIMAGE 公司推出划时代的全新三维动画工具,名为 SOFTIMAGE|XSI。其中字母“X”来源于微软公司的“.x”技术。实际上,其强有力的竞争对手,时为 sgi 公司子公司的 Alias 公司,已于 1998 年先行推出同样划时代的系列三维动画工具 Maya。外界认为,SOFTIMAGE|XSI 的推出是匆忙的。其 1.0 版本功能非常有限。值得褒赞的是,SOFTIMAGE|XSI 的人机交互设计、三维多边形建模功能、场景数据管理功能、曲线动画设计功能和三维渲染能力都非常出众。脚本环境基于微软公司的 JScript 标准,异常友好。参见下例:</p>
<pre><code class="hljs language-js"><span class="hljs-comment">/*<br
><span class="inline-pre-whitespaces indentation"> </span>This is a file of the standard of JScript from Microsoft.<br
><span class="inline-pre-whitespaces indentation"> </span>It runs in SOFTIMAGE|XSI scripting environment.<br
><span class="inline-pre-whitespaces indentation"> </span>The functionality of this file's is to print some details<br
><span class="inline-pre-whitespaces indentation"> </span>of a 3D object selected by the user.<br
>*/</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-title class_">SelectObj</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">_cam_particles_painting.focus_plane_indicator</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation comma">,</span> <span class="hljs-literal null">null</span><span class="punctuation comma">,</span> <span class="hljs-literal null">null</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-comment">// User currently selected Object</span><br
><span class="hljs-keyword var">var</span> o3DObj <span class="punctuation equal-sign">=</span> <span class="hljs-title class_">Selection</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-number">0</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 var">var</span> oParam <span class="punctuation equal-sign">=</span> o3DObj<span class="punctuation period">.</span><span class="hljs-property">Parameters</span><span class="punctuation semi-colon">;</span><br
><span class="hljs-keyword var">var</span> oPrimitive <span class="punctuation equal-sign">=</span> o3DObj<span class="punctuation period">.</span><span class="hljs-property">ActivePrimitive</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-comment">// object: ICE Attribute Collection</span><br
><span class="hljs-keyword var">var</span> oIAC <span class="punctuation equal-sign">=</span> oPrimitive<span class="punctuation period">.</span><span class="hljs-property">ICEAttributes</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"><br
></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> oIAC<span class="punctuation period">.</span><span class="hljs-property">Count</span><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-title class_">LogMessage</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><span class="string-quote string-close-quote">'</span></span> <span class="punctuation plus-sign">+</span> i <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="hljs-title function_">oIAC</span><span class="punctuation parenthesis open-parenthesis">(</span>i<span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation period">.</span><span class="hljs-property">Name</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
><br
><span class="inline-pre-whitespaces indentation"><br
></span><span class="hljs-comment">// A specific attribute</span><br
><span class="hljs-keyword var">var</span> oIA <span class="punctuation equal-sign">=</span> oIAC<span class="punctuation period">.</span><span class="hljs-title class_">Item</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-string"><span class="string-quote string-open-quote">'</span><span class="string-body">nb_CameraUtil_FocusDistance</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-title class_">LogMessage</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">n</span></span><span class="escape-char"><span class="slash">\</span><span class="escaped-char">t</span></span><span class="escape-char"><span class="slash">\</span><span class="escaped-char">t</span></span> Name: <span class="escape-char"><span class="slash">\</span><span class="escaped-char">t</span></span><span class="escape-char"><span class="slash">\</span><span class="escaped-char">t</span></span></span><span class="string-quote string-close-quote">'</span></span> <span class="punctuation plus-sign">+</span> oIA<span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span><br
><span class="hljs-title class_">LogMessage</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">t</span></span> IsDefined: <span class="escape-char"><span class="slash">\</span><span class="escaped-char">t</span></span></span><span class="string-quote string-close-quote">'</span></span> <span class="punctuation plus-sign">+</span> oIA<span class="punctuation period">.</span><span class="hljs-property">IsDefined</span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span><br
><span class="hljs-title class_">LogMessage</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">t</span></span> DataType: <span class="escape-char"><span class="slash">\</span><span class="escaped-char">t</span></span></span><span class="string-quote string-close-quote">'</span></span> <span class="punctuation plus-sign">+</span> oIA<span class="punctuation period">.</span><span class="hljs-property">DataType</span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span><br
><span class="hljs-title class_">LogMessage</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">t</span></span> IsConstant: <span class="escape-char"><span class="slash">\</span><span class="escaped-char">t</span></span></span><span class="string-quote string-close-quote">'</span></span> <span class="punctuation plus-sign">+</span> oIA<span class="punctuation period">.</span><span class="hljs-property">IsConstant</span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span><br
><span class="hljs-title class_">LogMessage</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">t</span></span> IsReadOnly: <span class="escape-char"><span class="slash">\</span><span class="escaped-char">t</span></span></span><span class="string-quote string-close-quote">'</span></span> <span class="punctuation plus-sign">+</span> oIA<span class="punctuation period">.</span><span class="hljs-property">IsReadOnly</span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span><br
><span class="hljs-title class_">LogMessage</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">t</span></span> ElementCount: <span class="escape-char"><span class="slash">\</span><span class="escaped-char">t</span></span></span><span class="string-quote string-close-quote">'</span></span> <span class="punctuation plus-sign">+</span> oIA<span class="punctuation period">.</span><span class="hljs-property">ElementCount</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 var">var</span> dataArray <span class="punctuation equal-sign">=</span> oIA<span class="punctuation period">.</span><span class="hljs-property">DataArray</span><span class="punctuation semi-colon">;</span><br
><span class="hljs-title class_">LogMessage</span><span class="punctuation parenthesis open-parenthesis">(</span>oIA<span class="punctuation period">.</span><span class="hljs-property">DataArray</span><span class="punctuation period">.</span><span class="hljs-property">Element</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 for">for</span> <span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-keyword var">var</span> j <span class="punctuation equal-sign">=</span> <span class="hljs-number">0</span><span class="punctuation semi-colon">;</span> j <span class="punctuation less-than-sign"><</span> dataArray<span class="punctuation period">.</span><span class="hljs-property">length</span><span class="punctuation semi-colon">;</span> j<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-title class_">LogMessage</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><span class="string-quote string-close-quote">'</span></span> <span class="punctuation plus-sign">+</span> j <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> dataArray<span class="punctuation bracket open-bracket">[</span>j<span class="punctuation bracket close-bracket">]</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
></code></pre>
<p>后期于 4.0 版、5.1 版、7.0 版几次发力,提供了令业界赞叹的特性集。其中,自 2008 年春发布的 7.0 版始,其提供的“交互式创作环境(ICE)”借助可视化节点图可轻松操控庞大的数据流,构建逻辑规则,控制粒子系统,产生变幻无穷的效果。见图(来源于<a target="_blank" href="https://en.wikipedia.org/wiki/Autodesk_Softimage#ICE_Interactive_Creative_Environment">维基百科</a>):
<img src="./illustrates/softimage_xsi_2011_ice_graph.jpg" alt="This simple ICE graph deforms an input object (in the example a sphere was used) based on its vertex indices"></p>
<p>同年(2008 年)11 月 18 日,欧特克公司宣布全资收购 SOFTIMAGE 公司,并将其所有产品更名为小写(但首字母大写)的形式,即 “Softimage|xsi”。</p>
<p>2014 年 3 月,欧特克公司发布 SOFTIMAGE 全线产品的停产声明。Softimage|xsi 2015 版将成为该软件最后的发行版本。其中诸多优秀功能(特别是 ICE)将被逐一移植到 Maya 中。自此,争斗多年的 Maya 和 SOFTIMAGE|XSI,以前者“吞噬”后者而告终。</p>
<blockquote>
<p>(注:Alias 公司早于 SOFTIMAGE 公司被欧特克收购。因此 Maya 早于 SOFTIMAGE|XSI 归为欧特克旗下的产品)。</p>
</blockquote>
</blockquote>
<h2 id="%E6%8F%92%E5%9B%BE" tabindex="-1"><a class="header-anchor" href="#%E6%8F%92%E5%9B%BE">§</a> 插图</h2>
<h3 id="%E6%AD%A3%E5%B8%B8%E7%9A%84%E6%8F%92%E5%9B%BE" tabindex="-1"><a class="header-anchor" href="#%E6%AD%A3%E5%B8%B8%E7%9A%84%E6%8F%92%E5%9B%BE">§</a> 正常的插图</h3>
<p><img src="./illustrates/duan-er-pretty.jpg" alt="端儿美丽" title="端儿美丽"></p>
<h3 id="%E5%8A%A0%E8%BD%BD%E5%A4%B1%E8%B4%A5%E7%9A%84%E6%8F%92%E5%9B%BE" tabindex="-1"><a class="header-anchor" href="#%E5%8A%A0%E8%BD%BD%E5%A4%B1%E8%B4%A5%E7%9A%84%E6%8F%92%E5%9B%BE">§</a> 加载失败的插图</h3>
<p><img src="./images/beauty.jpg" alt="臭爸爸"></p>
<hr>
<h2 id="%E8%A7%86%E9%A2%91" tabindex="-1"><a class="header-anchor" href="#%E8%A7%86%E9%A2%91">§</a> 视频</h2>
<video controls>
<source src="./illustrates/flower.webm" type="video/webm">
<source src="./illustrates/冒泡排序-演示-图片来自《一像素》原始版.mp4" type="video/mp4">
抱歉,该浏览器不支持视频。
</video>
<details open>
<summary>在折叠内容块中的视频</summary>
<video controls>
<source src="./illustrates/flower.webm" type="video/webm">
<source src="./illustrates/冒泡排序-演示-图片来自《一像素》原始版.mp4" type="video/mp4">
抱歉,该浏览器不支持视频。
</video>
</details>
<hr>
<h2 id="%E7%A8%8B%E5%BA%8F%E4%BB%A3%E7%A0%81%E7%89%87%E6%AE%B5%E7%A4%BA%E4%BE%8B%E9%9B%86" tabindex="-1"><a class="header-anchor" href="#%E7%A8%8B%E5%BA%8F%E4%BB%A3%E7%A0%81%E7%89%87%E6%AE%B5%E7%A4%BA%E4%BE%8B%E9%9B%86">§</a> 程序代码片段示例集</h2>
<h3 id="javascript-%E4%BB%A3%E7%A0%81%E7%89%87%E6%AE%B5" tabindex="-1"><a class="header-anchor" href="#javascript-%E4%BB%A3%E7%A0%81%E7%89%87%E6%AE%B5">§</a> JavaScript 代码片段</h3>
<h4 id="%E5%88%97%E8%A1%A8%E9%A1%B9%E4%B8%AD%E7%9A%84%E4%BB%A3%E7%A0%81%E7%89%87%E6%AE%B5" tabindex="-1"><a class="header-anchor" href="#%E5%88%97%E8%A1%A8%E9%A1%B9%E4%B8%AD%E7%9A%84%E4%BB%A3%E7%A0%81%E7%89%87%E6%AE%B5">§</a> 列表项中的代码片段</h4>
<ul>
<li>
<p>先定义一个函数:</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
></code></pre>
<p>然后调用它:</p>
<pre><code class="hljs"><span class="hljs-built_in getCircleArea">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>
<blockquote>
<p><code>circumference</code> [sər'kʌmf(ə)rəns] <i>n.</i> 圆周长</p>
</blockquote>
</li>
<li>
<details open>
<summary>在折叠内容块中的代码块1</summary>
<pre><code class="hljs language-js"><span class="hljs-keyword var">var</span> age <span class="punctuation equal-sign">=</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">你多大了?</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span><br
></code></pre>
</details>
</li>
</ul>
<h4 id="%E5%9C%A8%E6%8A%98%E5%8F%A0%E5%86%85%E5%AE%B9%E5%9D%97%E4%B8%AD%E7%9A%84%E4%BB%A3%E7%A0%81%E5%9D%97" tabindex="-1"><a class="header-anchor" href="#%E5%9C%A8%E6%8A%98%E5%8F%A0%E5%86%85%E5%AE%B9%E5%9D%97%E4%B8%AD%E7%9A%84%E4%BB%A3%E7%A0%81%E5%9D%97">§</a> 在折叠内容块中的代码块</h4>
<p>下面是在折叠内容块中的代码块。</p>
<details open>
<summary>在折叠内容块中的代码块2</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>
<h4 id="%E5%9C%A8%E8%A1%8C%E6%96%87%E7%BB%93%E6%9E%84%E4%B9%8B%E6%89%80%E8%B0%93%E2%80%9C%E9%A1%B6%E5%B1%82%E2%80%9D%E7%9A%84%E4%BB%A3%E7%A0%81%E5%9D%97" tabindex="-1"><a class="header-anchor" href="#%E5%9C%A8%E8%A1%8C%E6%96%87%E7%BB%93%E6%9E%84%E4%B9%8B%E6%89%80%E8%B0%93%E2%80%9C%E9%A1%B6%E5%B1%82%E2%80%9D%E7%9A%84%E4%BB%A3%E7%A0%81%E5%9D%97">§</a> 在行文结构之所谓“顶层”的代码块</h4>
<pre><code class="hljs language-js"><span class="hljs-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="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">吴乐川</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">孔夫子热评西方美食</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">周瑜正式出任新航母舰长</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">李白担任北京大学名誉副校长</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">岳鹏举在南方各地视察防御工事</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">祖冲之发表全新论文,受到中科院表彰</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">武松打虎一案受到自然保护主义者质疑,有关部门已正式展开调查</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">李广在 2019 亚洲射箭锦标赛再次夺魁</span><span class="string-quote string-close-quote">'</span></span><span class="punctuation comma">,</span><br
><span class="punctuation bracket close-bracket">]</span><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">// 看看语句结尾分号的效果</span><br
><span class="hljs-keyword const">const</span> aNull <span class="punctuation equal-sign">=</span> <span class="hljs-literal null">null</span><span class="punctuation semi-colon">;</span><br
><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
>anInteger<span class="punctuation plus-plus-sign">++</span><span class="punctuation semi-colon">;</span><br
><span class="punctuation plus-plus-sign">++</span>anInteger<span class="punctuation semi-colon">;</span><br
>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
><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
><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> isAnArray <span class="punctuation equal-sign">=</span> <span class="hljs-literal true">true</span> <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> count <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> <span class="hljs-keyword continue">continue</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> <span class="hljs-keyword break">break</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
><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
>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
><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>这就是<br
><span class="inline-pre-whitespaces indentation"> </span>啰哩吧嗦的<br
><span class="inline-pre-whitespaces indentation"> </span>多行注释的效果。瞅瞅吧。<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="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="html-%E4%BB%A3%E7%A0%81%E7%89%87%E6%AE%B5" tabindex="-1"><a class="header-anchor" href="#html-%E4%BB%A3%E7%A0%81%E7%89%87%E6%AE%B5">§</a> HTML 代码片段</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">"zh-hans-CN"</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>吴乐川的示范文档<span class="hljs-tag"></<span class="hljs-name">title</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-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>欢迎!<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>大家好,我是<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>吴乐川<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">"poem"</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>关关雎鸠 在河之洲 窈窕淑女 君子好逑<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>天下事有难易乎?为之,则难者亦易矣;不为,则易者亦难矣。<br
><span class="inline-pre-whitespaces indentation"> </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>这是啰哩吧嗦的多行注释,<br
><span class="inline-pre-whitespaces indentation"> </span>写这么多行,<br
><span class="inline-pre-whitespaces indentation"> </span>只是为了能令其多占据几行。<br
><span class="inline-pre-whitespaces indentation"> </span>你瞧,大体如此。<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>我是按钮<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">"此处本应有美女"</span> <span class="hljs-attr tag-attribute-name-tilte">tilte</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"一位绝色美人"</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> 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
><span class="inline-pre-whitespaces indentation"> </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 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">'另一位绝色美人'</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><span class="language-javascript"><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-keyword var">var</span> girl <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 tag-attribute-name-buy">buy</span><span class="punctuation colon">:</span> <span class="hljs-keyword function">function</span> <span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-params"> clothesName </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="punctuation exclamation-marks odd-count">!</span><span class="hljs-variable language_">this</span><span class="punctuation period">.</span><span class="hljs-title function_">has</span><span class="punctuation parenthesis open-parenthesis">(</span> clothesName <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><span class="hljs-variable language_">this</span><span class="punctuation bracket open-bracket">[</span> clothesName <span class="punctuation bracket close-bracket">]</span> <span class="punctuation equal-sign">=</span> <span class="hljs-literal true">true</span><span class="punctuation semi-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><span class="hljs-string">'我刚买了'</span><span class="punctuation comma">,</span> clothesName<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> <span class="hljs-keyword else">else</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><span class="punctuation comma">,</span> clothesName<span class="punctuation comma">,</span> <span class="hljs-string">'了。钱省着点花吧。'</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
><span class="inline-pre-whitespaces indentation"> </span><span class="punctuation curly-brace close-curly-brace">}</span><span class="punctuation comma">,</span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-attr tag-attribute-name-has">has</span><span class="punctuation colon">:</span> <span class="hljs-keyword function">function</span> <span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-params"> clothesName </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="punctuation exclamation-marks even-count">!!</span><span class="hljs-variable language_">this</span><span class="punctuation bracket open-bracket">[</span> clothesName <span class="punctuation bracket close-bracket">]</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="inline-pre-whitespaces indentation"> </span><span class="punctuation curly-brace close-curly-brace">}</span><span class="punctuation semi-colon">;</span><br
><br
><span class="inline-pre-whitespaces indentation"> </span>girl<span class="punctuation period">.</span><span class="hljs-title function_">buy</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-string">'连衣裙'</span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span>girl<span class="punctuation period">.</span><span class="hljs-title function_">buy</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-string">'热裤'</span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span>girl<span class="punctuation period">.</span><span class="hljs-title function_">buy</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-string">'风衣'</span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span>girl<span class="punctuation period">.</span><span class="hljs-title function_">buy</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-string">'风衣'</span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span>girl<span class="punctuation period">.</span><span class="hljs-title function_">buy</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-string">'羽绒服'</span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span>girl<span class="punctuation period">.</span><span class="hljs-title function_">buy</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-string">'复古丝巾'</span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span>girl<span class="punctuation period">.</span><span class="hljs-title function_">buy</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-string">'复古丝巾'</span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span>girl<span class="punctuation period">.</span><span class="hljs-title function_">buy</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-string">'连衣裙'</span><span class="punctuation parenthesis close-parenthesis">)</span><span class="punctuation semi-colon">;</span><br
><span class="inline-pre-whitespaces indentation"> </span>girl<span class="punctuation period">.</span><span class="hljs-title function_">buy</span><span class="punctuation parenthesis open-parenthesis">(</span><span class="hljs-string">'复古丝巾'</span><span class="punctuation parenthesis close-parenthesis">)</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-src">src</span><span class="punctuation equal-sign">=</span><span class="hljs-string">"vue-jquery-angluar-react<span class="punctuation period">.</span>min<span class="punctuation period">.</span>js"</span> <span class="hljs-attr tag-attribute-name-async">async</span>></span><span class="language-handlebars"><span class="language-xml"><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
></span></span></code></pre>
<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">"zh-hans-CN"</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>吴乐川的示范文档<span class="hljs-tag"></<span class="hljs-name">title</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-h1">h1</span>></span>DOM 的概念<span class="hljs-tag"></<span class="hljs-name">h1</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-div">div</span>></span>我是一个DIV<span class="hljs-tag"></<span class="hljs-name">div</span>></span><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>第一个表的第1项<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>第一个表的第2项<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
><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>第二个表的第1项<span class="hljs-tag"></<span class="hljs-name">li</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span>这里还有一行文字呢<br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-li">li</span>></span>第二个表的第2项<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>第二个表的第3项<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>第二个表的第4项<span class="hljs-tag"></<span class="hljs-name">li</span>></span><br
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-comment"><!-- 插播一则养生广告:每天呼吸空气有助于维持生命。 --></span><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>第三个表的第1项<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>第三个表的第2项<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
><span class="inline-pre-whitespaces indentation"> </span><span class="hljs-tag"><<span class="hljs-name tag-name-li">li</span>></span>第二个表的第5项<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
><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="css-%E4%BB%A3%E7%A0%81%E7%89%87%E6%AE%B5" tabindex="-1"><a class="header-anchor" href="#css-%E4%BB%A3%E7%A0%81%E7%89%87%E6%AE%B5">§</a> CSS 代码片段</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">微软雅黑</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="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="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="stylus(css)-%E4%BB%A3%E7%A0%81%E7%89%87%E6%AE%B5" tabindex="-1"><a class="header-anchor" href="#stylus(css)-%E4%BB%A3%E7%A0%81%E7%89%87%E6%AE%B5">§</a> Stylus(CSS) 代码片段</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>这是啰哩吧嗦的多行注释,<br
><span class="inline-pre-whitespaces indentation"> </span>写这么多行,<br
><span class="inline-pre-whitespaces indentation"> </span>只是为了能令其多占据几行。<br
><span class="inline-pre-whitespaces indentation"> </span>你瞧,大体如此。<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">// 补偿 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">// 补偿 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-%E4%BB%A3%E7%A0%81%E7%89%87%E6%AE%B5" tabindex="-1"><a class="header-anchor" href="#xml-%E4%BB%A3%E7%A0%81%E7%89%87%E6%AE%B5">§</a> XML 代码片段</h3>
<p>节选自 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">"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 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">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="%E8%A1%A8%E6%A0%BC" tabindex="-1"><a class="header-anchor" href="#%E8%A1%A8%E6%A0%BC">§</a> 表格</h2>
<h3 id="markdown-%E8%A1%A8%E6%A0%BC" tabindex="-1"><a class="header-anchor" href="#markdown-%E8%A1%A8%E6%A0%BC">§</a> MarkDown 表格</h3>
<table>
<thead>
<tr>
<th style="text-align:right">项目</th>
<th>内容</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align:right">姓名</td>
<td>吴乐川</td>
</tr>
<tr>
<td style="text-align:right">性别</td>
<td>男</td>
</tr>
<tr>
<td style="text-align:right">出生年份</td>
<td>1979</td>
</tr>
<tr>
<td style="text-align:right">家乡</td>
<td>南昌市</td>
</tr>
<tr>
<td style="text-align:right">所爱</td>
<td><code>SOFTIMAGE|XSI</code></td>
</tr>
</tbody>
</table>
<h3 id="html-%E8%A1%A8%E6%A0%BC%E5%86%85%E5%B5%8C%E5%87%A0%E7%A7%8D%E4%BB%A3%E7%A0%81%E7%89%87%E6%AE%B5" tabindex="-1"><a class="header-anchor" href="#html-%E8%A1%A8%E6%A0%BC%E5%86%85%E5%B5%8C%E5%87%A0%E7%A7%8D%E4%BB%A3%E7%A0%81%E7%89%87%E6%AE%B5">§</a> HTML 表格内嵌几种代码片段</h3>
<table>
<thead>
<tr>
<th style="width: 7em;">甲</th>
<th>乙</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">你好</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>
普通文本
</td>
<td>
<h4>文章段落、多级标题在表格中的效果</h4>
<h5>《荷塘月色》[节选]</h5>
<p>曲曲折折的荷塘上面,弥望的是田田的叶子。叶子出水很高,像亭亭的舞女的裙。层层的叶子中间,零星地点缀着些白花,有袅娜地开着的,有羞涩地打着朵儿的;正如一粒粒的明珠,又如碧天里的星星,又如刚出浴的美人。微风过处,送来缕缕清香,仿佛远处高楼上渺茫的歌声似的。这时候叶子与花也有一丝的颤动,像闪电般,霎时传过荷塘的那边去了。叶子本是肩并肩密密地挨着,这便宛然有了一道凝碧的波痕。叶子底下是脉脉的流水,遮住了,不能见一些颜色;而叶子却更见风致了。</p>
</td>
</tr>
</tbody>
</table>
</article>
<nav class="markdown-article-toc"><ol><li><a href="#%E8%87%AA%E7%84%B6%E8%AF%AD%E8%A8%80%E8%8C%83%E6%96%87"> 自然语言范文</a><ol><li><a href="#%E3%80%8A%E5%8D%83%E5%AD%97%E6%96%87%E3%80%8B%5B%E8%8A%82%E9%80%89%5D"> 《千字文》[节选]</a></li><li><a href="#%E3%80%8A%E6%97%A5%E8%AE%B0%EF%BC%882019%E5%B9%B46%E6%9C%8818%E6%97%A5%EF%BC%89%E3%80%8B%5B%E8%8A%82%E9%80%89%5D"> 《日记(2019年6月18日)》[节选]</a></li><li><a href="#%E5%94%90%E8%AF%97"> 唐诗</a><ol><li><a href="#%E3%80%8A%E9%A9%AC%E8%AF%97%E4%BA%8C%E5%8D%81%E4%B8%89%E9%A6%96%C2%B7%E5%85%B6%E4%BA%94%E3%80%8B"> 《马诗二十三首·其五》</a></li></ol></li><li><a href="#%E6%9D%82%E4%B9%B1%E5%86%85%E5%AE%B9%EF%BC%8C%E4%BB%85%E7%94%A8%E4%BA%8E%E8%A7%86%E8%A7%89%E6%A0%B7%E5%BC%8F%E4%B9%8B%E5%91%88%E7%A4%BA"> 杂乱内容,仅用于视觉样式之呈示</a><ol><li><a href="#%E5%A4%8D%E6%9D%82%E7%9A%84%E6%A0%B7%E5%BC%8F%E7%BB%84%E5%90%88"> 复杂的样式组合</a></li><li><a href="#%E9%A1%BB%E7%9F%A5%E7%9D%80%E9%87%8D%E6%88%96%E5%BC%BA%E8%B0%83%E4%B9%83%E8%87%B3%E4%BD%9C%E5%BA%9F%E7%9A%84%E6%96%87%E5%AD%97%E4%BB%A5%E5%8F%8A%E4%B8%93%E6%9C%89%E5%90%8D%E8%AF%8D%E4%BA%A6%E5%8F%AF%E8%83%BD%E5%87%BA%E7%8E%B0%E5%9C%A8%E6%A0%87%E9%A2%98%E4%B8%AD"> 须知着重或强调乃至作废的文字以及专有名词亦可能出现在标题中</a></li><li><a href="#%E5%A4%9A%E7%BA%A7%E5%88%97%E8%A1%A8%E4%B9%8B%E7%A4%BA%E8%8C%83"> 多级列表之示范</a></li></ol></li><li><a href="#%E5%A4%9A%E7%BA%A7%E6%A0%87%E9%A2%98%EF%BC%88%E8%BF%99%E6%98%AF-%3Ch3%3E%EF%BC%89"> 多级标题(这是 <h3>)</a><ol><li><a href="#%E5%8A%A8%E7%94%BB%E7%89%87%E3%80%8A%E4%B9%9D%E8%89%B2%E9%B9%BF%E3%80%8B%EF%BC%88%E8%BF%99%E6%98%AF-%3Ch4%3E%EF%BC%89"> 动画片《九色鹿》(这是 <h4>)</a></li><li><a href="#web-api-%E5%8F%AF%E4%BB%A5%E5%88%86%E4%B8%BA%E5%BE%88%E5%A4%9A%E7%B1%BB%EF%BC%88%E8%BF%99%E6%98%AF-%3Ch4%3E%EF%BC%89"> Web API 可以分为很多类(这是 <h4>)</a><ol><li><a href="#%E5%81%87%E5%A6%82%E6%9F%90%E6%A0%87%E9%A2%98%E9%9D%9E%E5%B8%B8%E9%95%BF%EF%BC%8C%E5%88%99%E8%AF%A5%E6%A0%87%E9%A2%98%E5%8F%AF%E8%83%BD%E6%8A%98%E8%A1%8C%EF%BC%8C%E5%8D%B3%E5%8D%A0%E6%8D%AE%E5%A4%9A%E8%A1%8C%EF%BC%8C%E5%B0%A4%E5%85%B6%E6%98%AF%E5%9C%A8%E7%AA%84%E5%B0%8F%E7%9A%84%E6%B5%8F%E8%A7%88%E5%99%A8%E7%AA%97%E5%8F%A3%E4%B8%AD%EF%BC%88%E8%BF%99%E6%98%AF-%3Ch5%3E%EF%BC%89"> 假如某标题非常长,则该标题可能折行,即占据多行,尤其是在窄小的浏览器窗口中(这是 <h5>)</a></li><li><a href="#%E5%B1%82%E5%8F%A0%E6%A0%B7%E5%BC%8F%E8%A1%A8%E5%AF%B9%E8%B1%A1%E6%A8%A1%E5%9E%8B%EF%BC%88%E8%BF%99%E6%98%AF-%3Ch5%3E%EF%BC%89"> 层叠样式表对象模型(这是 <h5>)</a></li><li><a href="#%E5%BC%95%E7%94%A8%E6%9D%A5%E6%BA%90%EF%BC%88%E8%BF%99%E6%98%AF-h5%EF%BC%89"> 引用来源(这是 h5)</a></li></ol></li></ol></li><li><a href="#%E5%BC%95%E7%94%A8%E7%9A%84%E6%96%87%E5%AD%97"> 引用的文字</a><ol><li><a href="#softimage%7Cxsi"> SOFTIMAGE|XSI</a></li></ol></li></ol></li><li><a href="#%E6%8F%92%E5%9B%BE"> 插图</a><ol><li><a href="#%E6%AD%A3%E5%B8%B8%E7%9A%84%E6%8F%92%E5%9B%BE"> 正常的插图</a></li><li><a href="#%E5%8A%A0%E8%BD%BD%E5%A4%B1%E8%B4%A5%E7%9A%84%E6%8F%92%E5%9B%BE"> 加载失败的插图</a></li></ol></li><li><a href="#%E8%A7%86%E9%A2%91"> 视频</a></li><li><a href="#%E7%A8%8B%E5%BA%8F%E4%BB%A3%E7%A0%81%E7%89%87%E6%AE%B5%E7%A4%BA%E4%BE%8B%E9%9B%86"> 程序代码片段示例集</a><ol><li><a href="#javascript-%E4%BB%A3%E7%A0%81%E7%89%87%E6%AE%B5"> JavaScript 代码片段</a><ol><li><a href="#%E5%88%97%E8%A1%A8%E9%A1%B9%E4%B8%AD%E7%9A%84%E4%BB%A3%E7%A0%81%E7%89%87%E6%AE%B5"> 列表项中的代码片段</a></li><li><a href="#%E5%9C%A8%E6%8A%98%E5%8F%A0%E5%86%85%E5%AE%B9%E5%9D%97%E4%B8%AD%E7%9A%84%E4%BB%A3%E7%A0%81%E5%9D%97"> 在折叠内容块中的代码块</a></li><li><a href="#%E5%9C%A8%E8%A1%8C%E6%96%87%E7%BB%93%E6%9E%84%E4%B9%8B%E6%89%80%E8%B0%93%E2%80%9C%E9%A1%B6%E5%B1%82%E2%80%9D%E7%9A%84%E4%BB%A3%E7%A0%81%E5%9D%97"> 在行文结构之所谓“顶层”的代码块</a></li></ol></li><li><a href="#html-%E4%BB%A3%E7%A0%81%E7%89%87%E6%AE%B5"> HTML 代码片段</a></li><li><a href="#css-%E4%BB%A3%E7%A0%81%E7%89%87%E6%AE%B5"> CSS 代码片段</a></li><li><a href="#stylus(css)-%E4%BB%A3%E7%A0%81%E7%89%87%E6%AE%B5"> Stylus(CSS) 代码片段</a></li><li><a href="#xml-%E4%BB%A3%E7%A0%81%E7%89%87%E6%AE%B5"> XML 代码片段</a></li></ol></li><li><a href="#%E8%A1%A8%E6%A0%BC"> 表格</a><ol><li><a href="#markdown-%E8%A1%A8%E6%A0%BC"> MarkDown 表格</a></li><li><a href="#html-%E8%A1%A8%E6%A0%BC%E5%86%85%E5%B5%8C%E5%87%A0%E7%A7%8D%E4%BB%A3%E7%A0%81%E7%89%87%E6%AE%B5"> HTML 表格内嵌几种代码片段</a></li></ol></li></ol></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>