vscode 更换markdown样式的方法(任意样式都行),并推荐我自用样式(参考于Pie)。
注意:更新插件后,CSS样式会重置,需要将你的样式重新设置一遍
网上大多的方法是这种:
https://blog.csdn.net/csdnear/article/details/78229021
但是有很多局限性
第二种方法:markdown.styles[]
第二种方法微软已经改版,不能引用任意路径的css了,只能引用在此工作区下的css。可这样的话,每次换工作区写markdown都要先引入css,多此一举。
第三种方法:Markdown Preview Enhanced
网上对于第三种方法,大多都只是更换 Markdown Preview Enhanced 插件自带的CSS,但是我想要更换我自己的css样式,在网上却很难找得到。
如何利用插件更换想要的markdown样式?
打开你vscode插件位置,我的是
C:\Users\.vscode\extensions\shd101wyy.markdown-preview-enhanced-0.5.21\node_modules\@shd101wyy\mume\styles
这里有两个文件夹(关于prism_theme的作用,末尾再详细介绍)
打开preview_theme文件夹,选择并打开其中一个你不想要的样式(这里我选择的是github_dark),把其内容用你钟意的css内容覆盖掉。
此时再打开vscode,在你的settings.json中加入一段代码,选择你之前被覆盖掉的css样式
"markdown-preview-enhanced.previewTheme": "github-dark.css",
不知道什么原因,css里的字体大小(font-size)设置在插件预览里好像不生效,如果你想要更改你的字体大小、背景颜色等设置,可以用 Markdown Preview Enhanced 自带的 style.less 文件
Ctrl+Shift+P -> markdown-preview-enhanced.customizeCss
在里面写上你想要的额外设置的简单样式
再打开插件的侧边预览
可以看到markdown样式成功设置成自己想要的css了
如果你满意一个markdown样式的设计,唯独不满意其代码块的设计,你可以在
第二个文件夹单独设计代码块的样式,来覆盖该markdown样式自带的代码块
打开 prism_theme 文件夹,选中一个你不要的代码块样式,用你想要的代码块样式将其替换,这里我选的是one-dark
再打开vscode,在你的settings.json中加入一段代码,选择你之前被覆盖掉的css样式
"markdown-preview-enhanced.codeBlockTheme": "one-dark.css",
打开预览后,可以看到,我的代码块发生了变化
原本的:
现在的:
附上我的css和代码块css:
https://blog.csdn.net/RP123123123/article/details/118112918
Markdown Preview Enhanced 插件将markdown打印成带样式的PDF:
https://blog.csdn.net/RP123123123/article/details/118113026
css是基于pie 样式做出了相应修改
代码块css是用的:https://blog.csdn.net/qq_43324834/article/details/107551200
vscode 更换markdown样式的方法(任意样式都行),并推荐我自用样式(参考于Pie)。相关推荐
- 小别墅样式_乡村小别墅设计图纸推荐,流行样式都在这里!
如今在乡村建别墅已经是很常见的事情了,各式各样的别墅都能见到.下面小编给大家推荐几套乡村小别墅的设计图,都是今年的流行样式! 别墅户型一 图纸编号:yg621 别墅风格:中式 占地面积:157㎡ 预估 ...
- JS中修改元素内容,属性,样式的方法【详解】
改变元素内容的方法: .innerHTML=内容(可识别标签) .innerText=内容(只识别文本) 如果把属性作为集合,那么样式就是这个集合 ...
- ios 系统状态栏样式修改_iOS 一种新的修改导航栏样式的方法(支持iOS10).
iOS 一种新的修改导航栏样式的方法. 开宗明义: 对系统导航栏最底层的UIView加一层CALayer, 通过操作这个自己创建的CALayer来修改导航栏样式. 修改系统导航栏样式的几种方法 1.使 ...
- jsp ul设置滚动条_jquery实现Li滚动时滚动条自动添加样式的方法
本文实例讲述了jquery实现Li滚动时滚动条自动添加样式的方法.分享给大家供大家参考.具体如下: 这里使用jquery实现当拖动滚动条的时候,Li滚动列表中的内容会自动随滚动条变化而下移,并自动添加 ...
- dw的css样式怎么删除掉,三种方法教你DreamWeaver下如何应用CSS样式
首先介绍一下CSS样式的属性: CSS样式属性被分为八大类:类型,背景,区块,边框,列表,定位,扩展. 类型主要定义文本的字体,大小,颜色,行高和修饰等.如图所示: 方法一: 内联样式可以通过styl ...
- jQuery使用toggleClass方法动态添加删除Class样式的方法
本文实例讲述了jQuery使用toggleClass方法动态添加删除Class样式的方法.分享给大家供大家参考.具体分析如下: jQuery通过toggleClass方法动态添加删除Class,一次执 ...
- html局部可复制,截取网页局部区域css样式的方法和系统的制作方法
截取网页局部区域css样式的方法和系统的制作方法 [技术领域] [0001]本发明涉及计算机网络技术领域,特别是涉及一种截取网页局部区域CSS样式的方法和系统. [背景技术] [0002]CSS(Ca ...
- php 修改 wordpress,修改WordPress中文章编辑器的样式的方法详解
这篇文章主要介绍了修改WordPress中文章编辑器的样式的方法详解,同时文中也推荐了两款取代默认文章编辑器的插件,需要的朋友可以参考下 自定义文章编辑器的样式每一个 WordPress 主题的文章样 ...
- JQuery中操作Css样式的方法
JQuery中操作Css样式的方法 <strong>//1.获取和设置样式</strong> $("#tow").attr("class&q ...
最新文章
- C++之指向对象成员函数的指针
- 明明白白你的Linux服务器——硬件篇
- 神经网络与深度学习——TensorFlow2.0实战(笔记)(三)(python运算符和表达式)
- 基于External-DNS的多集群Service DNS实践
- linux-mysql了解
- 大数据时代都说python发展非常好,学习Python,到底有啥优势?
- 华为已经没落的一个手机系列 无人问津甚至有点多余
- 百度CTO王海峰:百度翻译每日翻译量已达到千亿字符
- 普惠AI,将是开发者下一个风口吗?看看他们怎么说
- 对象可以创建数组吗_电脑零基础可以学习创建网站吗?
- ffmpeg ACC音频播放
- 第三十一章 SQL命令 DROP DATABASE
- 张亚勤、刘慈欣、周鸿祎、王飞跃新书推荐,《崛起的超级智能:互联网大脑如何影响科技未来》...
- java阴阳师抽卡算法_阴阳师抽卡小技巧,抽出SSR很轻松
- 欧氏空间距离和内积_欧氏空间的内积与线性变换
- AI插画师:生成对抗网络
- Python re.compile以及group分组
- mysql 时间格式转换年月日时分秒
- 麦子学院深度学习视频SVM人脸识别课程代码修改及实现
- 计算机模拟需要什么配置电脑,城市天际线配置要求 最低电脑配置要求