方法一:下载自己喜欢的样式

Typora的代码块语法高亮使用的是CodeMirror实现的,所以需要更换代码块的样式,可以去CodeMirror提供的主题里下载样式表文件。

CodeMirror页面,选择下图中的Themes,即可跳到代码块样式展示界面。

在代码块样式展示界面可以浏览相应样式的高亮效果:

然后到主题里选择相应的样式表文件,其css源代码会以html页面展示:

然后在typora中使用快捷键Ctrl+,(或者:文件->偏好设置->外观)打开偏好设置后选择外观:

点击上图红框部分,会弹出主题所在文件夹,建立相应的copy的css样式文件,如以dracula为例:

然后将其代码中所有的.cm-s-dracula改为.cm-s-inner,其他样式的修改方式也如同此。重开typora窗口生效。主题下多了dracula的选项,选中即可,这种修改方式产生的主题只改变代码块的高亮样式。

方法二:获取Typora自制主题

文件->偏好设置->外观中点击右下角的获取主题,有很多已有的主题供选择,不乏一些好看的主题样式加高亮代码:

选择一个自己喜欢的进行下载,将下载得到的文件夹解压,以catfish为例,将文件夹内的:

红框部分的文件拷贝到typora的themes文件夹下(方法一中已经说明如何快速定位到此本地的主题文件夹),如图:

重启typora窗口生效。此方式得到的是一个完整的主题。

方法三:自己撰写css样式文件

如果现有的主题样式都不喜欢那就自己仿着现有代码高亮样式的格式写吧,写一个自己最喜欢的。

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

Typora 修改代码块高亮样式的更多相关文章

  1. Typora设置代码块Mac风格三个圆点

    写作不停,美化不止! mac小圆点效果 原本代码块样式就挺....干净的,光秃秃的,太单调了: 是吧很丑,于是自己发挥改成了这样: 好吧还是太单调,也没好看到哪里去,于是隔了两天又重新改,DuangD ...

  2. Typora markdown代码块显示序号

    打开偏好设置,找到代码块 打开显示行号 然后关闭Typora重新打开 此时代码块就有行号了

  3. 从此 Typora 代码块有了颜色

    起因 平时喜欢用typora记笔记,但是typora默认代码块没有指定语言,没有高亮看着很不舒服,所以用Autohotkey花了半天写了个脚本,按自己的快捷键就可以自动生成代码块并添加语言,这样就方便 ...

  4. CSDN Markdown编辑器插入代码块时不能代码高亮

    当我们点击插入代码块按钮,会提示我们在这里插入代码片,我们在三个单引号对之间输入代码后发现并没有实现代码块高亮, 如下图所示: <!DOCTYPE html> <html lang= ...

  5. 一键生成通用高亮代码块到剪贴板,快捷粘贴兼容 TT/WX/BJ 编辑器

    有些在线图文编辑器不支持直接插入代码块,但可以直接粘贴 HTML 格式的高亮代码块. 花了一点时间研究了一下各家的编辑器,规则却各不相同.有的要求代码块被包含于 <code> ... &l ...

  6. 用Python高亮org-mode代码块

    文章同时可在我的github blog上阅读:http://cheukyin.github.io/python/2014-08/pygments-highlight-src-export-html.h ...

  7. [置顶] 如何更改CSDN博客高亮代码皮肤的样式,使博客看起来更有范(推荐)

    由于本人写博客的时候,也没有配置博客的相关属性,因此贴出来的代码块都是CSDN默认的,因此代码背景色都是白色的,如下所示: 但是本人在浏览他人博客的时候,发现有些博客的代码块看起来比较有范,整个代码库 ...

  8. 如何使用SublimeText风格的代码高亮样式 添加Zed Coding(EMMET)插件

    因为觉得博客园自带的代码高亮样式很单一,不符合作为前端的我的审美习惯,于是下定决心要想办法折腾出一个方法来应用上另外一套代码高亮样式. 虽然探索的过程是很痛苦的,但最后还是成功了,但也不枉付出的那些努 ...

  9. 如何更改CSDN博客高亮代码皮肤的样式,使博客看起来更有范(推荐)

    由于本人写博客的时候,也没有配置博客的相关属性,因此贴出来的代码块都是CSDN默认的,因此代码背景色都是白色的,如下所示: 但是本人在浏览他人博客的时候,发现有些博客的代码块看起来比较有范,整个代码库 ...

随机推荐

  1. Fastdfs数据迁移方案

    1.     方案背景描述 环境迁移,需要迁移旧环境的fastdfs集群的数据到新环境,由于之前数据迁移仅仅是针对mysql和mongodb,对fastdfs数据的迁移了解甚少,本文档主要是针对fas ...

  2. 控制流程-if/while/for

    目录 一.控制流程之if判断 1.单分支结构 2.双分支结构 3.多分支结构 二.控制流程之while循环 1.基本使用 2.break 3.continue 三.流程控制之for循环 1.break ...

  3. 基于element-ui封装一个Table模板组件

    大家在做后台管理系统的时候,写的最多的可能就是表格页面了,一般分三部分:搜索功能区.表格内容区和分页器区.一般这些功能都是使用第三方组件库实现,比如说element-ui,或者vuetify.这两个组 ...

  4. Python爬虫学习笔记(四)

    Request: Test1(基本属性:POST): 代码1: import requests # 发送POST请求 data = { } response = requests.post(url, ...

  5. 一文了解python的 @property

    参考自: https://www.programiz.com/python-programming/property Python为我们提供了一个内置装饰器@property,此方法使得getter和 ...

  6. E: Some index files failed to download. They have been**

    转: E: Some index files failed to download. They have been** 问题描述: 当使用Dockerfile从包含cuda的镜像建立新的image的时 ...

  7. c++中深层复制(浅层复制运行错误)成功运行-----sample

    下面随笔给出c++中深层复制(浅层复制运行错误)成功运行------sample. 浅层复制与深层复制 浅层复制 实现对象间数据元素的一一对应复制. 深层复制 当被复制的对象数据成员是指针类型时,不是 ...

  8. MacOS如何调整JD-GUI反编译工具字体大小

    how to change the fontsize of JD-GUI in MacOS? MacOS如何调整JD-GUI反编译工具字体大小? 问题描述 JD-GUI是一款比较好用的反编译工具,不小 ...

  9. Java 树结构的基础部分(一)

    二叉树 1.1 为什么需要树这种数据结构 1) 数组存储方式的分析 优点:通过下标方式访问元素,速度快.对于有序数组,还可使用二分查找提高检索速度. 缺点:如果要检索具体某个值,或者插入值(按一定顺序 ...

  10. 解决springMVC https环境 jstlview redirect时变为http请求的问题

    <property name="redirectHttp10Compatible" value="false" />