Wirkung: Der Titel hat eine eigene Seriennummer, der Codeblock hat ein Farbschema und in der oberen linken Ecke des Codeblocks wird ein Mac-ähnliches Symbol angezeigt Öffnen Sie zunächst den Themenordner Datei > Einstellungen > Darstellung > Designordner öffnen Bearbeiten Sie dann die Datei base.user.css (falls sie nicht existiert, erstellen Sie eine neue). Fügen Sie einfach den folgenden Code hinzu /*Titel fügt automatisch Seriennummer hinzu*/ .Seitenleisteninhalt { Zähler-Reset:h1 } .Umriss-h1 { Zähler-Reset:h2 } .Umriss-h2 { Zähler-Reset: h3 } .Umriss-h3 { Zähler-Reset:h4 } .Umriss-h4 { Zählerrücksetzung: h5 } .Umriss-h5 { Zählerrücksetzung: h6 } .outline-h1>.outline-item>.outline-label:vor { Zählerinkrement: h1; Inhalt: Zähler(h1) " " } .outline-h2>.outline-item>.outline-label:vor { Zählerinkrement: h2; Inhalt: Zähler(h1) "."Zähler(h2) " " } .outline-h3>.outline-item>.outline-label:vor { Zählerinkrement: h3; Inhalt: Zähler(h1) "."Zähler(h2) "."Zähler(h3) " " } .outline-h4>.outline-item>.outline-label:vor { Zählerinkrement: h4; Inhalt: Zähler(h1) "."Zähler(h2) "."Zähler(h3) "."Zähler(h4) " " } .outline-h5>.outline-item>.outline-label:vor { Gegeninkrement: h5; Inhalt: Zähler(h1) "."Zähler(h2) "."Zähler(h3) "."Zähler(h4) "."Zähler(h5) " " } .outline-h6>.outline-item>.outline-label:vor { Zählerinkrement: h6; Inhalt: Zähler(h1) "."Zähler(h2) "."Zähler(h3) "."Zähler(h4) "."Zähler(h5) "."Zähler(h6) " " } #schreiben { Zähler-Reset:h1 } h1 { Zähler-Reset:h2 } h2 { Zähler-Reset: h3 } h3 { Zähler-Reset:h4 } h4 { Zählerrücksetzung: h5 } h5 { Zählerrücksetzung: h6 } #schreibe h1:vor { Zählerinkrement: h1; Inhalt: Zähler(h1) " " } #schreibe h2:vor { Zählerinkrement: h2; Inhalt: Zähler(h1) "."Zähler(h2) " " } #schreibe h3:vorher, h3.md-focus.md-heading:vorher { Zählerinkrement: h3; Inhalt: Zähler(h1) "."Zähler(h2) "."Zähler(h3) " " } #schreibe h4:vorher, h4.md-focus.md-heading:vor { Zählerinkrement: h4; Inhalt: Zähler(h1) "."Zähler(h2) "."Zähler(h3) "."Zähler(h4) " " } #schreibe h5:vorher, h5.md-focus.md-heading:vor { Gegeninkrement: h5; Inhalt: Zähler(h1) "."Zähler(h2) "."Zähler(h3) "."Zähler(h4) "."Zähler(h5) " " } #schreibe h6:vorher, h6.md-focus.md-heading:vor { Zählerinkrement: h6; Inhalt: Zähler(h1) "."Zähler(h2) "."Zähler(h3) "."Zähler(h4) "."Zähler(h5) "."Zähler(h6) " " } #schreiben>h3.md-Fokus:vor, #schreiben>h4.md-fokus:vorher, #schreiben>h5.md-Fokus:vor, #schreiben>h6.md-Fokus:vor, h3.md-Fokus:vorher, h4.md-Fokus:vorher, h5.md-Fokus:vorher, h6.md-Fokus:vor { Farbe: erben; Grenze: erben; Rahmenradius: erben; Position: erben; links: Initiale; Schwimmer: keiner; oben: Initiale; Schriftgröße: erben; padding-left: erben; padding-right: erben; vertikale Ausrichtung: erben; Schriftstärke: erben; Zeilenhöhe: erben; } /*Da die Codeblöcke verschiedener Themen unterschiedlich sind, wird der Codeteil vereinheitlicht*/ .CodeMirror-Zeilen { Polsterung links: 4px; } .code-tooltip { Kastenschatten: 0 1px 1px 0 rgba (0,28,36,.3); Rahmen oben: 1px durchgezogen #eef2f2; } .md-Zäune, Code, tt { Hintergrundfarbe: #f8f8f8; Rahmenradius: 3px; Polsterung: 0; Polsterung links: 4px !wichtig; Polsterung rechts: 4px !wichtig; Schriftgröße: 0,9em; } Code { Hintergrundfarbe: #f3f4f4; Polsterung: 0 2px 0 2px; } .md-Zäune { Rand unten: 15px; Rand oben: 15px; Polsterung oben: 8px; Polsterung unten: 6px; } .md-task-list-item > Eingabe { Rand links: -1,3em; } @media drucken { html { Schriftgröße: 13px; } Tisch, vor { Seitenumbruch innen: vermeiden; } vor { Zeilenumbruch: Wort umbrechen; } } .md-Zäune { Hintergrundfarbe: #f8f8f8; } #schreibe pre.md-meta-block { Polsterung: 1rem; Schriftgröße: 85 %; Zeilenhöhe: 1,45; Hintergrundfarbe: #f7f7f7; Rand: 0; Rahmenradius: 3px; Farbe: #777777; Rand oben: 0 !wichtig; } .mathjax-block>.code-tooltip { unten: .375rem; } /*Dunkler Hintergrund*/ #write .md-fences:nicht([Meerjungfrau-Typ]) { Polsterung oben: 7px; Rahmenradius: 10px; Hintergrundfarbe: #282c34; Farbe: #eeeeee; } .code-tooltip .ty-Eingabe, .code-tooltip Eingabe { Farbe: #eee; } /*Drei Symbole von MAC*/ .CodeMirror-wrap .CodeMirror-scroll { Polsterung oben: 20px; } #schreibe .md-fences:before { Inhalt: ""; Z-Index: 4; Anzeige: Block; Position: absolut; oben: 7px; links: 13px; Breite: 15px; Höhe: 15px; Randradius: 50 %; schweben: links; Hintergrundfarbe: #fa3534; } #schreiben .CodeMirror-scroll:vor { Inhalt: ""; Anzeige: Block; Position: absolut; oben: 0px; links: 29px; Breite: 15px; Höhe: 15px; Randradius: 50 %; schweben: links; Z-Index: 999; Hintergrundfarbe: #ff9900; } #schreibe .md-fences::nach { Inhalt: ""; Z-Index: 4; Anzeige: Block; Position: absolut; oben: 7px; links: 53px; Breite: 15px; Höhe: 15px; Randradius: 50 %; schweben: links; Hintergrundfarbe: #19be6b; } /*Farbe*/ .CodeMirror-Zeile .cm-Nummer,/*Nummer*/ .CodeMirror-line .cm-property {/*Die aufgerufene Methode*/ Farbe: #f08d49; } .CodeMirror-line .cm-variable-3,/*Parameter, Typ*/ .CodeMirror-Zeile .cm-Qualifizierer, /*CSS-Klasse*/ .CodeMirror-line .cm-variable-2 {/*Verwendete Parameter*/ Farbe: #FFCB6B; } .CodeMirror-line .cm-meta,/*Ellipsen, Kommentare usw.*/ .CodeMirror-line .cm-atom, /*CSS-Attributwert, Boolescher Wert usw.*/ .CodeMirror-Zeile .cm-Schlüsselwort{/*Schlüsselwort*/ Farbe: #cc99cd; } .CodeMirror-line .cm-def,/*Variablenname*/ .CodeMirror-line .cm-variable {/*Der verwendete Variablenname*/ Farbe: #FFCB6B; } .CodeMirror-line .cm-builtin {/*Das aufzurufende Attribut*/ Farbe: #82AAFF; } .CodeMirror-Zeile .cm-Kommentar {/*Kommentar*/ Farbe: #888; } .CodeMirror-Zeile .cm-Zeichenfolge,/*Zeichenfolge*/ .CodeMirror-line .cm-string-2 {/*Regulärer Ausdruck*/ Farbe: #7ec699 } .CodeMirror-Zeile .cm-Operator {/*Operator*/ Farbe: #67cdcc } .CodeMirror div.CodeMirror-cursor {/* Cursor */ Rahmen links: 1px durchgezogen #fff; Z-Index: 3; } .CodeMirror-selected,/*Ausgewählter Hintergrund*/ .CodeMirror-ausgewählter Text { Hintergrund: #666 !wichtig; } /*html*/ .CodeMirror-line .cm-tag{/*Tagname*/ Farbe: #F07178; } .CodeMirror-line .cm-bracket{/*Winkelklammer am Tag*/ Farbe: #FFF; } .CodeMirror-Zeile .cm-Attribut{/*Attribut*/ Farbe: #FFCB6B; } Dies ist das Ende dieses Artikels über den Implementierungscode der Typora-Codeblock-Farbanpassung und der Titelseriennummer. Weitere relevante Typora-Codeblock-Inhalte finden Sie in den vorherigen Artikeln von 123WORDPRESS.COM oder in den folgenden verwandten Artikeln. Ich hoffe, Sie werden 123WORDPRESS.COM auch in Zukunft unterstützen! |
<<: SQL-Übung: Produktkategorie-Datenoperation in der Online-Shopping-Datenbank
Flex-Grundkonzepte Flex-Layout (Flex ist die Abkü...
RocketMQ ist eine verteilte, warteschlangenbasier...
Alle unten aufgeführten Blogs sind originell und ...
In Google Chrome werden Sie nach der erfolgreiche...
Trennung von statischer und dynamischer Dynamisch...
Einführung in Swap Swap (d. h. Swap-Partition) in...
Das Ziel dieses Dokuments ist es, die JSON-Serial...
Die Konfigurationssyntax von Nginx ist flexibel u...
Nach der Umstellung vom Schreibstil von Vue2 auf ...
Wir wissen, dass wir beim Verwenden von HTML im N...
Inhaltsverzeichnis Gängige Zahlungsarten in Proje...
Warum? Am einfachsten lässt es sich so ausdrücken:...
1. docker ps -a zeigt den laufenden Image-Prozess...
Installation der Msyql-Datenbank. Zu Ihrer Inform...
1. Gehen Sie zunächst auf die offizielle Website,...