Typora 修改代码块高亮样式
方法一:下载自己喜欢的样式
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 修改代码块高亮样式的更多相关文章
- Typora设置代码块Mac风格三个圆点
写作不停,美化不止! mac小圆点效果 原本代码块样式就挺....干净的,光秃秃的,太单调了: 是吧很丑,于是自己发挥改成了这样: 好吧还是太单调,也没好看到哪里去,于是隔了两天又重新改,DuangD ...
- Typora markdown代码块显示序号
打开偏好设置,找到代码块 打开显示行号 然后关闭Typora重新打开 此时代码块就有行号了
- 从此 Typora 代码块有了颜色
起因 平时喜欢用typora记笔记,但是typora默认代码块没有指定语言,没有高亮看着很不舒服,所以用Autohotkey花了半天写了个脚本,按自己的快捷键就可以自动生成代码块并添加语言,这样就方便 ...
- CSDN Markdown编辑器插入代码块时不能代码高亮
当我们点击插入代码块按钮,会提示我们在这里插入代码片,我们在三个单引号对之间输入代码后发现并没有实现代码块高亮, 如下图所示: <!DOCTYPE html> <html lang= ...
- 一键生成通用高亮代码块到剪贴板,快捷粘贴兼容 TT/WX/BJ 编辑器
有些在线图文编辑器不支持直接插入代码块,但可以直接粘贴 HTML 格式的高亮代码块. 花了一点时间研究了一下各家的编辑器,规则却各不相同.有的要求代码块被包含于 <code> ... &l ...
- 用Python高亮org-mode代码块
文章同时可在我的github blog上阅读:http://cheukyin.github.io/python/2014-08/pygments-highlight-src-export-html.h ...
- [置顶] 如何更改CSDN博客高亮代码皮肤的样式,使博客看起来更有范(推荐)
由于本人写博客的时候,也没有配置博客的相关属性,因此贴出来的代码块都是CSDN默认的,因此代码背景色都是白色的,如下所示: 但是本人在浏览他人博客的时候,发现有些博客的代码块看起来比较有范,整个代码库 ...
- 如何使用SublimeText风格的代码高亮样式 添加Zed Coding(EMMET)插件
因为觉得博客园自带的代码高亮样式很单一,不符合作为前端的我的审美习惯,于是下定决心要想办法折腾出一个方法来应用上另外一套代码高亮样式. 虽然探索的过程是很痛苦的,但最后还是成功了,但也不枉付出的那些努 ...
- 如何更改CSDN博客高亮代码皮肤的样式,使博客看起来更有范(推荐)
由于本人写博客的时候,也没有配置博客的相关属性,因此贴出来的代码块都是CSDN默认的,因此代码背景色都是白色的,如下所示: 但是本人在浏览他人博客的时候,发现有些博客的代码块看起来比较有范,整个代码库 ...
随机推荐
- 为WebView 同步cookie
import android.os.Build;import android.text.TextUtils;import android.webkit.CookieManager;import and ...
- 如何用css写一个带斜切角、有边框又有内外阴影的按钮呢?
如果有一天,UI设计师丢过来一张UI稿,上面有这样一个带有斜切角.有边框还有内外阴影的按钮,你会怎么实现呢?第一反应切图?可是按钮内容.大小都是可变的,那得切多少图啊~Canvas?SVG?No,no ...
- MySQL:事务机制
为什么需要事务处理? 在执行SQL语句的时候,某些业务要求,一系列操作必须全部执行,而不能仅执行一部分. MySQL5.0后引入了事务机制,MySQL支持几种基本的数据库引擎,并非所有引擎都支持事务处 ...
- 微信小程序onReachBottom第二次失效
当整个页面就是一个view包着一个轮播.一个横向scroll-view和一个纵向scroll-view onReachBottom方法只执行一次 解决方法:
- 在Linux上从零开始部署前后端分离的Vue+Spring boot项目
最近做了一个前后端分离的商城项目来熟悉开发的整个流程,最后希望能有个正式的部署流程,于是试着把项目放在云服务器上,做了一下发现遇到了不少问题,借此记录一下整个部署的过程. 使用的技术栈如标题所说大体上 ...
- 利用xslt与xml实现具体字段字母的大小写转换
定义一个全局的变量 <xsl:variable name="smallcase" select="'abcdefghijklmnopqrstuvwxyz'" ...
- Mark一个代码量统计工具-Statistic
安装方式 IDEA.Goland系列插件市场搜索Statistic 简单说明 统计纬度比较丰富 基本覆盖常见纬度,如代码行数,文件大小等,各指标取最大最小及平均值. 统计目录为当前项目目录 只有在当前 ...
- Apache配置 8.配置防盗链
(1)介绍 防盗链,通俗讲,就是不让别人盗用你网站上的资源.这个资源,通常指的是图片.视频.歌曲.文档等. (2)配置 配置防盗链先编辑主机配置文件: #vim /usr/local/apache2. ...
- Activiti工作流学习笔记(三)——自动生成28张数据库表的底层原理分析
原创/朱季谦 我接触工作流引擎Activiti已有两年之久,但一直都只限于熟悉其各类API的使用,对底层的实现,则存在较大的盲区. Activiti这个开源框架在设计上,其实存在不少值得学习和思考的地 ...
- JMeter扩展Java请求实现WebRTC本地音视频推流压测脚本
WebRTC是Web Real-Time Communication缩写,指网页即时通讯,是一个支持Web浏览器进行实时语音或视频对话的API,实现了基于网页的视频会议,比如声网的Agora Web ...