本主題是我將Orange主題和Newsprint主題進(jìn)行合并修改后的主題樣式，后續(xù)還會(huì)繼續(xù)優(yōu)化，如果有建議可以在評(píng)論區(qū)指出。

修改/添加Typora的步驟：

文件-偏好設(shè)置-外觀-主題-打開(kāi)主題文件

將以下內(nèi)容保存至一個(gè)以.css結(jié)尾的文件內(nèi)，然后重啟Typora

樣式特點(diǎn)：

頁(yè)面、圖片寬度最大化，使頁(yè)面內(nèi)容面積最大；

代碼主題設(shè)置為 abbott 。

/* meyer reset -- http://meyerweb.com/eric/tools/css/reset/ , v2.0 | 20110126 | License: none (public domain) */@include-when-export url(https://fonts.loli.net/css?family=PT+Serif:400,400italic,700,700italic&subset=latin,cyrillic-ext,cyrillic,latin-ext);/* =========== *//* pt-serif-regular - latin */ @font-face {font-family: 'PT Serif';font-style: normal;font-weight: normal;src: local('PT Serif'), local('PTSerif-Regular'), url('./newsprint/pt-serif-v11-latin-regular.woff2') format('woff2');unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* pt-serif-italic - latin */ @font-face {font-family: 'PT Serif';font-style: italic;font-weight: normal;src: local('PT Serif Italic'), local('PTSerif-Italic'), url('./newsprint/pt-serif-v11-latin-italic.woff2') format('woff2');unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* pt-serif-700 - latin */ @font-face {font-family: 'PT Serif';font-style: normal;font-weight: bold;src: local('PT Serif Bold'), local('PTSerif-Bold'), url('./newsprint/pt-serif-v11-latin-700.woff2') format('woff2');unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* pt-serif-700italic - latin */ @font-face {font-family: Consolas, 'PT Serif';font-style: italic;font-weight: bold;src: local('PT Serif Bold Italic'), local('PTSerif-BoldItalic'), url('./newsprint/pt-serif-v11-latin-700italic.woff2') format('woff2');unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }:root {--active-file-bg-color: #dadada;--active-file-bg-color: rgba(32, 43, 51, 0.63);--active-file-text-color: white;--bg-color: #f3f2ee;--text-color: #1f0909;--control-text-color: #444;--rawblock-edit-panel-bd: #e5e5e5;--select-text-bg-color: rgba(32, 43, 51, 0.63);--select-text-font-color: white; }pre {--select-text-bg-color: #36284e;--select-text-font-color: #fff; }html {font-size: 1em; }html, body {background-color: #f3f2ee;font-family: "Consolas", 'Times New Roman', Times, serif;color: #1f0909;line-height: 1.5em; }/*#write {overflow-x: auto;max-width: initial;padding-left: calc(50% - 17em);padding-right: calc(50% - 17em); }@media (max-width: 36em) {#write {padding-left: 1em;padding-right: 1em;} }*/#write {max-width: 1920px;margin: 0 auto; }@media only screen and (min-width: 1400px) {#write {max-width: 1920px;} }ol li {list-style-type: decimal;list-style-position: outside; } ul li {list-style-type: disc;list-style-position: outside; }ol, ul {list-style: none; }blockquote, q {quotes: none; } blockquote:before, blockquote:after, q:before, q:after {content: '';content: none; } table {border-collapse: collapse;border-spacing: 0; } /* styles *//* ====== *//* headings */h1, h2, h3, h4, h5, h6 {font-weight: bold; } h1 {font-size: 1.875em;/*30 / 16*/line-height: 1.6em;/* 48 / 30*/margin-top: 2em; } h2, h3 {font-size: 1.3125em;/*21 / 16*/line-height: 1.15;/*24 / 21*/margin-top: 2.285714em;/*48 / 21*/margin-bottom: 1.15em;/*24 / 21*/ } h3 {font-weight: normal; } h4 {font-size: 1.125em;/*18 / 16*/margin-top: 2.67em;/*48 / 18*/ } h5, h6 {font-size: 1em;/*16*/ } h1 {border-bottom: 3px solid rgb(239, 112, 96); } /* links */a {text-decoration: none;color: #065588; } a:hover, a:active {text-decoration: underline; } /* block spacing */p, blockquote, .md-fences {margin-bottom: 1.5em; } h1, h2, h3, h4, h5, h6 {margin-bottom: 1.5em; } /* blockquote */blockquote {font-style: italic;border-left: 5px solid;margin-left: 2em;padding-left: 1em; } /* lists */ul, ol {margin: 0 0 1.5em 1.5em; } /* tables */ .md-meta,.md-before, .md-after {color:#999; } img {width:"100%";height:"100%"; } table {margin-bottom: 1.5em;/*24 / 16*/font-size: 1em;/* width: 100%; */ } thead th, tfoot th {padding: .25em .25em .25em .4em;text-transform: uppercase; } th {text-align: left; } td {vertical-align: top;padding: .25em .25em .25em .4em; }code, .md-fences {background-color: #dadada; }code {padding-left: 2px;padding-right: 2px; }.md-fences {font-family: Consolas;margin-left: 0em;margin-bottom: 3em;padding-left: 1ch;padding-right: 1ch; }pre, code, tt {font-size: .875em;line-height: 1.714285em; } /* some fixes */h1 {line-height: 1.3em;font-weight: normal; } h1 span {display: inline-block;font-weight: bold;background: rgb(239, 112, 96);color: #ffffff;padding: 3px 10px 1px;border-top-right-radius: 3px;border-top-left-radius: 3px;margin-right: 3px; }p + ul, p + ol{margin-top: .5em; }h3 + ul, h4 + ul, h5 + ul, h6 + ul, h3 + ol, h4 + ol, h5 + ol, h6 + ol {margin-top: .5em; }li > ul, li > ol {margin-top: inherit;margin-bottom: 0; }li ol>li {list-style-type: lower-alpha; }li li ol>li{list-style-type: lower-roman; }h2, h3 {margin-bottom: .75em; } hr {border-top: none;border-right: none;border-bottom: 1px solid;border-left: none; }blockquote {border-color: rgb(239, 112, 96);color: rgb(158, 100, 92); }blockquote ul, blockquote ol {margin-left:0; }.ty-table-edit {background-color: transparent; } thead {background-color: #dadada; } tr:nth-child(even) {background: #e8e7e7; } hr {border-color: #c5c5c5; } .task-list{padding-left: 1rem; }.md-task-list-item {padding-left: 1.5rem;list-style-type: none; }.md-task-list-item > input:before {content: '\221A';display: inline-block;width: 1.25rem;height: 1.6rem;vertical-align: middle;text-align: center;color: #ddd;background-color: #F3F2EE; }.md-task-list-item > input:checked:before, .md-task-list-item > input[checked]:before{color: inherit; }#write pre.md-meta-block {min-height: 1.875rem;color: #555;border: 0px;background: transparent;margin-top: -4px;margin-left: 1em;margin-top: 1em; }.md-image>.md-meta {color: #9B5146; }.md-image>.md-meta{font-family: Consolas, Menlo, 'Ubuntu Mono', 'Courier New', 'Microsoft Yahei', 'Hiragino Sans GB', 'WenQuanYi Micro Hei', serif; }#write>h3.md-focus:before{left: -1.5rem;color:#999;border-color:#999; } #write>h4.md-focus:before{left: -1.5rem;top: .25rem;color:#999;border-color:#999; } #write>h5.md-focus:before{left: -1.5rem;top: .0.3125rem;color:#999;border-color:#999; } #write>h6.md-focus:before{left: -1.5rem;top: 0.3125rem;color:#999;border-color:#999; }.md-toc:focus .md-toc-content{margin-top: 19px; }.md-toc-content:empty:before{color: #065588; } .md-toc-item {color: #065588; } #write div.md-toc-tooltip {background-color: #f3f2ee; }#typora-sidebar {background-color: #f3f2ee;-webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.375);box-shadow: 0 6px 12px rgba(0, 0, 0, 0.375); }.pin-outline #typora-sidebar {background: inherit;box-shadow: none;border-right: 1px dashed; }.pin-outline #typora-sidebar:hover .outline-title-wrapper {border-left:1px dashed; }.outline-item:hover {background-color: #dadada;border-left: 28px solid #dadada;border-right: 18px solid #dadada; }.typora-node .outline-item:hover {border-right: 28px solid #dadada; }.outline-expander:before {content: "\f0da";font-family: FontAwesome;font-size:14px;top: 1px; }.outline-expander:hover:before, .outline-item-open>.outline-item>.outline-expander:before {content: "\f0d7"; }.modal-content {background-color: #f3f2ee; }.auto-suggest-container ul li {list-style-type: none; }/** UI for electron */.megamenu-menu, #top-titlebar, #top-titlebar *, .megamenu-content {background: #f3f2ee;color: #1f0909; }.megamenu-menu-header {border-bottom: 1px dashed #202B33; }.megamenu-menu {box-shadow: none;border-right: 1px dashed; }header, .context-menu, .megamenu-content, footer {font-family: Consolas, "PT Serif", 'Times New Roman', Times, serif;color: #1f0909; }#megamenu-back-btn {color: #1f0909;border-color: #1f0909; }.megamenu-menu-header #megamenu-menu-header-title:before {color: #1f0909; }.megamenu-menu-list li a:hover, .megamenu-menu-list li a.active {color: inherit;background-color: #e8e7df; }.long-btn:hover {background-color: #e8e7df; }#recent-file-panel tbody tr:nth-child(2n-1) {background-color: transparent !important; }.megamenu-menu-panel tbody tr:hover td:nth-child(2) {color: inherit; }.megamenu-menu-panel .btn {background-color: #D2D1D1; }.btn-default {background-color: transparent; }.typora-sourceview-on #toggle-sourceview-btn, .ty-show-word-count #footer-word-count {background: #c7c5c5; }#typora-quick-open {background-color: inherit; }.md-diagram-panel {margin-top: 8px; }.file-list-item-file-name {font-weight: initial; }.file-list-item-summary {opacity: 1; }.file-list-item {color: #777; }.file-list-item.active {background-color: inherit;color: black; }.ty-side-sort-btn.active {background-color: inherit; }.file-list-item.active .file-list-item-file-name {font-weight: bold; }.file-list-item{opacity:1 !important; }.file-library-node.active>.file-node-background{background-color: rgba(32, 43, 51, 0.63);background-color: var(--active-file-bg-color); }.file-tree-node.active>.file-node-content{color: white;color: var(--active-file-text-color); }.md-task-list-item>input {margin-left: -1.7em;margin-top: calc(1rem - 12px); }input {border: 1px solid #aaa; }.megamenu-menu-header #megamenu-menu-header-title, .megamenu-menu-header:hover, .megamenu-menu-header:focus {color: inherit; }.dropdown-menu .divider {border-color: #e5e5e5; }/* https://github.com/typora/typora-issues/issues/2046 */ .os-windows-7 strong, .os-windows-7 strong {font-weight: 760; }.ty-preferences .btn-default {background: transparent; }.ty-preferences .window-header {border-bottom: 1px dashed #202B33;box-shadow: none; }#sidebar-loading-template, #sidebar-loading-template.file-list-item {color: #777; }.searchpanel-search-option-btn.active {background: #777;color: white; }/** abbott.css* A warm, dark theme for prose and code, with pastels and pretty greens.** Ported from abbott.vim (https://github.com/bcat/abbott.vim) version 2.1.* Original design and CodeMirror port by Jonathan Rascher.** This theme shares the following color palette with the Vim color scheme.** Brown shades:* bistre: #231c14* chocolate: #3c3022* cocoa: #745d42* vanilla_cream: #fef3b4** Red shades:* crimson: #d80450* cinnabar: #f63f05** Green shades:* dark_olive: #273900* forest_green: #24a507* chartreuse: #a0ea00* pastel_chartreuse: #d8ff84** Yellow shades:* marigold: #fbb32f* lemon_meringue: #fbec5d** Blue shades:* cornflower_blue: #3f91f1* periwinkle_blue: #8ccdf0** Magenta shades:* french_pink: #ec6c99* lavender: #e6a2f3** Cyan shades:* zomp: #39a78d* seafoam_green: #00ff7f*//* Style the UI: *//* Equivalent to Vim's Normal group. */ .cm-s-inner.CodeMirror {background: #231c14 /* bistre */;color: #d8ff84 /* pastel_chartreuse */; }/* Roughly equivalent to Vim's LineNr group. */ .cm-s-inner .CodeMirror-gutters {background: #231c14 /* bistre */;border: none; } .cm-s-inner .CodeMirror-linenumber { color: #fbec5d /* lemon_meringue */; }.cm-s-inner .CodeMirror-guttermarker { color: #f63f05 /* cinnabar */; }/* Roughly equivalent to Vim's FoldColumn group. */ .cm-s-inner .CodeMirror-guttermarker-subtle { color: #fbb32f /* marigold */; }/** Roughly equivalent to Vim's CursorColumn group. (We use a brighter color* since Vim's cursorcolumn option highlights a whole column, whereas* CodeMirror's rule just highlights a thin line.)*/ .cm-s-inner .CodeMirror-ruler { border-color: #745d42 /* cocoa */; }/* Equivalent to Vim's Cursor group in insert mode. */ .cm-s-inner .CodeMirror-cursor { border-color: #a0ea00 /* chartreuse */; }/* Equivalent to Vim's Cursor group in normal mode. */ .cm-s-inner.cm-fat-cursor .CodeMirror-cursor, .cm-s-inner .cm-animate-fat-cursor {/** CodeMirror doesn't allow changing the foreground color of the character* under the cursor, so we can't use a reverse video effect for the cursor.* Instead, make it semitransparent.*/background: rgba(160, 234, 0, 0.5) /* chartreuse */; } .cm-s-inner.cm-fat-cursor .CodeMirror-cursors {/** Boost the z-index so the fat cursor shows up on top of text and* matchingbracket/matchingtag highlights.*/z-index: 3; }/* Equivalent to Vim's Cursor group in replace mode. */ .cm-s-inner .CodeMirror-overwrite .CodeMirror-cursor {border-bottom: 1px solid #a0ea00 /* chartreuse */;border-left: none;width: auto; }/* Roughly equivalent to Vim's CursorIM group. */ .cm-s-inner .CodeMirror-secondarycursor {border-color: #00ff7f /* seafoam_green */; }/* Roughly equivalent to Vim's Visual group. */ .cm-s-inner .CodeMirror-selected, .cm-s-inner.CodeMirror-focused .CodeMirror-selected {background: #273900 /* dark_olive */; } .cm-s-inner .CodeMirror-line::selection, .cm-s-inner .CodeMirror-line > span::selection, .cm-s-inner .CodeMirror-line > span > span::selection {background: #273900 /* dark_olive */; } .cm-s-inner .CodeMirror-line::-moz-selection, .cm-s-inner .CodeMirror-line > span::-moz-selection, .cm-s-inner .CodeMirror-line > span > span::-moz-selection {background: #273900 /* dark_olive */; }/* Roughly equivalent to Vim's SpecialKey group. */ .cm-s-inner .cm-tab { color: #00ff7f /* seafoam_green */; }/* Equivalent to Vim's Search group. */ .cm-s-inner .cm-searching {background: #fef3b4 /* vanilla_cream */ !important;color: #231c14 /* bistre */ !important; }/* Style syntax highlighting modes: *//* Equivalent to Vim's Comment group. */ .cm-s-inner span.cm-comment {color: #fbb32f /* marigold */;font-style: italic; }/* Equivalent to Vim's String group. */ .cm-s-inner span.cm-string, .cm-s-inner span.cm-string-2 {color: #e6a2f3 /* lavender */; }/* Equivalent to Vim's Constant group. */ .cm-s-inner span.cm-number, .cm-s-inner span.cm-string.cm-url { color: #f63f05 /* cinnabar */; }/* Roughly equivalent to Vim's SpecialKey group. */ .cm-s-inner span.cm-invalidchar { color: #00ff7f /* seafoam_green */; }/* Equivalent to Vim's Special group. */ .cm-s-inner span.cm-atom { color: #fef3b4 /* vanilla_cream */; }/* Equivalent to Vim's Delimiter group. */ .cm-s-inner span.cm-bracket, .cm-s-inner span.cm-punctuation {color: #fef3b4 /* vanilla_cream */; }/* Equivalent Vim's Operator group. */ .cm-s-inner span.cm-operator { font-weight: bold; }/* Roughly equivalent to Vim's Identifier group. */ .cm-s-inner span.cm-def, .cm-s-inner span.cm-variable, .cm-s-inner span.cm-variable-2, .cm-s-inner span.cm-variable-3 {color: #8ccdf0 /* periwinkle_blue */; }/* Roughly equivalent to Vim's Function group. */ .cm-s-inner span.cm-builtin, .cm-s-inner span.cm-property, .cm-s-inner span.cm-qualifier {color: #3f91f1 /* cornflower_blue */; }/* Equivalent to Vim's Type group. */ .cm-s-inner span.cm-type { color: #24a507 /* forest_green */; }/* Equivalent to Vim's Keyword group. */ .cm-s-inner span.cm-keyword {color: #d80450 /* crimson */;font-weight: bold; }/* Equivalent to Vim's PreProc group. */ .cm-s-inner span.cm-meta { color: #ec6c99 /* french_pink */; }/* Equivalent to Vim's htmlTagName group (linked to Statement). */ .cm-s-inner span.cm-tag {color: #d80450 /* crimson */;font-weight: bold; }/* Equivalent to Vim's htmlArg group (linked to Type). */ .cm-s-inner span.cm-attribute { color: #24a507 /* forest_green */; }/* Equivalent to Vim's htmlH1, markdownH1, etc. groups (linked to Title). */ .cm-s-inner span.cm-header {color: #d80450 /* crimson */;font-weight: bold; }/* Equivalent to Vim's markdownRule group (linked to PreProc). */ .cm-s-inner span.cm-hr { color: #ec6c99 /* french_pink */; }/* Roughly equivalent to Vim's Underlined group. */ .cm-s-inner span.cm-link { color: #e6a2f3 /* lavender */; }/* Equivalent to Vim's diffRemoved group. */ .cm-s-inner span.cm-negative {background: #d80450 /* crimson */;color: #231c14 /* bistre */; }/* Equivalent to Vim's diffAdded group. */ .cm-s-inner span.cm-positive {background: #a0ea00 /* chartreuse */;color: #231c14 /* bistre */;font-weight: bold; }/* Equivalent to Vim's Error group. */ .cm-s-inner span.cm-error {background: #d80450 /* crimson */;color: #231c14 /* bistre */; }/* Style addons: *//* Equivalent to Vim's MatchParen group. */ .cm-s-inner span.CodeMirror-matchingbracket {background: #745d42 /* cocoa */ !important;color: #231c14 /* bistre */ !important;font-weight: bold; }/** Roughly equivalent to Vim's Error group. (Vim doesn't seem to have a direct* equivalent in its own matchparen plugin, but many syntax highlighting plugins* mark mismatched brackets as Error.)*/ .cm-s-inner span.CodeMirror-nonmatchingbracket {background: #d80450 /* crimson */ !important;color: #231c14 /* bistre */ !important; }.cm-s-inner .CodeMirror-matchingtag, .cm-s-inner .cm-matchhighlight {outline: 1px solid #39a78d /* zomp */; }/* Equivalent to Vim's CursorLine group. */ .cm-s-inner .CodeMirror-activeline-background, .cm-s-inner .CodeMirror-activeline-gutter {background: #3c3022 /* chocolate */; }/* Equivalent to Vim's CursorLineNr group. */ .cm-s-inner .CodeMirror-activeline-gutter .CodeMirror-linenumber {color: #d8ff84 /* pastel_chartreuse */;font-weight: bold; }/* Roughly equivalent to Vim's Folded group. */ .cm-s-inner .CodeMirror-foldmarker {color: #f63f05 /* cinnabar */;text-shadow: none; }

總結(jié)

以上是生活随笔為你收集整理的一个自用Typora魔改主题的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。