Typora 修改代碼塊高亮樣式


方法一:下載自己喜歡的樣式

Typora的代碼塊語法高亮使用的是CodeMirror實現的,所以需要更換代碼塊的樣式,可以去CodeMirror提供的主題里下載樣式表文件。

CodeMirror頁面,選擇下圖中的Themes,即可跳到代碼塊樣式展示界面。image-20201211143551635

在代碼塊樣式展示界面可以瀏覽相應樣式的高亮效果:

image-20201211143858850

然后到主題里選擇相應的樣式表文件,其css源代碼會以html頁面展示:

image-20201211144108362

然后在typora中使用快捷鍵Ctrl+,(或者:文件->偏好設置->外觀)打開偏好設置后選擇外觀:

image-20201211144410024

點擊上圖紅框部分,會彈出主題所在文件夾,建立相應的copy的css樣式文件,如以dracula為例:

image-20201211144600156

然后將其代碼中所有的.cm-s-dracula改為.cm-s-inner,其他樣式的修改方式也如同此。重開typora窗口生效。主題下多了dracula的選項,選中即可,這種修改方式產生的主題只改變代碼塊的高亮樣式。

方法二:獲取Typora自制主題

文件->偏好設置->外觀中點擊右下角的獲取主題,有很多已有的主題供選擇,不乏一些好看的主題樣式加高亮代碼:

image-20201211145338061

選擇一個自己喜歡的進行下載,將下載得到的文件夾解壓,以catfish為例,將文件夾內的:

image-20201211145523585

紅框部分的文件拷貝到typora的themes文件夾下(方法一中已經說明如何快速定位到此本地的主題文件夾),如圖:

image-20201211145827926

重啟typora窗口生效。此方式得到的是一個完整的主題。

方法三:自己撰寫css樣式文件

如果現有的主題樣式都不喜歡那就自己仿着現有代碼高亮樣式的格式寫吧,寫一個自己最喜歡的。



參考https://ruterly.com/2017/01/10/Typora/


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM