vscode Markdown 预览样式美化多方案推荐

优雅的使用 vscode写 Markdown,预览样式美化

1 介绍

我已经习惯使用 vscode 写 markdown。不是很喜欢他的 markdown 样式,尤其是代码块高亮的样式。当然用 vscode 大家基本上都会选择安装一个Markdown-preview-enhanced的插件,这个插件的确实是非常强大。
即便自带了很多样式, 但还是没有挑到一款自己喜欢的样式。

官方文档:https://shd101wyy.github.io/markdown-preview-enhanced/#/zh-cn/config

样式开源地址: 样式链接

1.1 大致效果

我找了以前写的一道题解来试试效果,下面是导出的 pdf,


2 主题预览

2.1 单行代码

这是单行代码maserhe.top

2.2 表格

2.3 代码块

3 Markdown 语法

请参考 w3c Markdown 语法快速入门手册

4 操作

4.1前提

你已经安装好 markdown-preview-enhanced这个强大的插件了,
没有安装?
打开 vscode 编辑器,在插件页搜索 markdown-preview-enhanced,接着点击 Install 按钮。

4.1 clone 源码

https://github.com/Maserhe/VScode-Markdown-theme-Maserhe

首先将源码clone到本地, 当然也可以直接预览复制代码, 在电脑上新建txt文件, 把代码复制上去改一下后缀为css
mystyle.css存放的是 Markdown 排版样式。
codeblock.css存放的是 代码块样式。
当然你可以自己进行自定义修改成你自己喜欢的样式,很多地方我都加上了注释。

4.2 找到 vscode Markdown-preview-enhanced 插件主题位置

文件大致位置在 C:\Users\你的用户名\.vscode\extensions\shd101wyy.markdown-preview-enhanced-0.5.12\node_modules\@shd101wyy\mume\styles

preview_theme 这里存放的是 Markdown 排版样式,你把刚刚得到的mystyle.css文件放进去就行了。
prism_theme 这里存放的是 代码块 排版样式,你把刚刚得到的codeblock.css文件放进去就行了。

4.3 配置 json 文件。

打开 vscode , 输入 Ctrl-shift-p然后打开 Open Settings(json) 文件

修改 红框圈起来的两项, 第一项为 Markdown 的排版样式。
第二项为 代码块的样式。

配置好之后再打开 Markdown 预览看一下,是不是美观很多?

4.4 导出 pdf 文件

光自己看可不行啊,最终还是要导出 pdf 呢!


在预览界面 右键》HTML》HTML(offline) 生成 html 文件后,找到 html 文件我们用谷歌浏览打开 html 文件。我们可以使用谷歌浏览器的 HTML 打印功能生成干干净净的 pdf。

注意选择 Goolge 浏览器打印时,

把背景图型哪一项给勾选上,然后就能生成好看的 pdf 文件了。

更多选择

其实 markdown-preview-enhanced 带的插件也不少,你们喜欢的话也可以自己调换一个自己喜欢的风格。

打开 vscode 在设置中 搜索Markdown-preview-enhanced: Preview Theme 可以更改自己喜欢的样式。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/194006.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

java分布式锁分布式锁

java分布式&锁&分布式锁 锁 锁的作用:有限资源的情况下,控制同一时间段,只有某些线程(用户/服务器)能访问到资源。 锁在java中的实现: synchronized关键字并发包的类 缺点:只对单个的…

HCIA-H12-811题目解析(2)

1、【单选题】 在以太网这种多点访问网络上PPPOE服务器可以通过一个以太网端口与很多PPPOE客户端建立起PPP连接,因此服务器必须为每个PPP会话建立唯一的会话标识符以区分不同的连接PPPOE会使用什么参数建立会话标识符? 2、【单选题】PPP协议定义的是OSI参考模型中…

Chem. Eng. J | 掌控基于ESIPT的AIE效应设计具有单组分白光发射的光学材料

今天为大家介绍一篇近期发表在Chemical Engineering Journal上的论文:Controlling ESIPT-based AIE effects for designing optical materials with single-component white-light emission。论文通讯作者为中南大学董界副教授和曾文彬教授,论文第一作者…

【Leetcode】907. 子数组的最小值之和

给定一个整数数组 arr,找到 min(b) 的总和,其中 b 的范围为 arr 的每个(连续)子数组。 由于答案可能很大,因此 返回答案模 10^9 7 。 示例 1: 输入:arr [3,1,2,4] 输出:17 解释&…

1、Linux_介绍和安装

1. Linux概述 Linux:是基于Unix的一个开源、免费的操作系统,其稳定性、安全性、处理多并发能力强,目前大多数企业级应用甚至是集群项目都部署运行在linux操作系统之上,在我国软件公司得到广泛的使用 Unix:是一个强大…

RK3568平台开发系列讲解(Linux系统篇)pinctrl api介绍及实验

🚀返回专栏总目录 文章目录 一、pinctrl函数介绍二、设备树案例三、驱动案例 沉淀、分享、成长,让自己和他人都能有所收获!😄 📢本篇将介绍pinctrl api及其使用案例 。 一、pinctrl函数介绍 ①获取设备对应的 pinctrl…

TS 函数及多态

TS 能推导出函数体中的类型,但多数情况下无法推导出参数的类型,只有少数特殊情况下能根据上下文推导参数的类型。返回类型能推导出,不过也可以显式注解。 1 声明和调用函数 一般来说,在方法中的this值为调用该方法时位于点号左侧…

Vue框架学习笔记——条件渲染:v-show和v-if

文章目录 前文提要条件渲染v-showv-ifv-else-if和v-else特殊写法,很多个一致的v-if如何消除 总结 前文提要 本人仅做个人学习记录,如有错误,请多包涵 主要学习链接:尚硅谷Vue2.0Vue3.0全套教程丨vuejs从入门到精通 条件渲染 条…

Vatee万腾的数字探险之旅:vatee科技创新的新纪元

在数字时代的潮流中,Vatee万腾以其独特的数字探险之旅引领着科技创新的新纪元。这不仅是一次技术的进步,更是一场数字领域的探险,让我们一同探索Vatee在科技创新中的前沿地带。 Vatee万腾的数字探险起源于对未知的渴望和对创新的不懈追求。在…

使用Terraform创建Docker镜像和容器

为了实现自动化操作,Terraform需要明确指定所使用的提供者。因此,在主要的main.tf文件中,需要提供提供者的名称、源和版本信息。对于Docker,可以在main.tf中使用以下代码块。 1 Terraform配置模块 使用块和资源创建Terraform脚本…

JMeter之压力测试——混合场景并发

在实际的压力测试场景中,有时会遇到多个场景混合并发的情况,这时就需要设置不同的并发比例对不同场景请求数量的控制,下面提供两种方案。 一、多线程组方案 1.业务场景设计如下:场景A、场景B、场景C,三个场景按照并发…

MySQL 前瞻

数据库 是一类软件,这一类软件可以用来“管理数据”(对数据进行保存,增删改查 [与数据结构的有什么区别呢?]) 数据结构是实现增删改查的具体方式 数据库则是管理数据的软件,实现数据库软件内部就用到了很…

java多线程-扩展知识一:进程线程、并发并行、同步异步

1、进程 进程(Process)是计算机中的程序关于某数据集合上的一次运行活动,是系统进行资源分配的基本单位,是操作系统结构的基础。在早期面向进程设计的计算机结构中,进程是程序的基本执行实体;在当代面向线程…

【RLChina2023】CCF 苏州 记录

目录 RLChina介绍主旨报告专题报告智能体学习理论(专题一)智能体决策与规划(专题二)智能体框架、体系结构与训练系统(专题六)基于大语言模型的具身智能体与机器人研究 (专题八)教学报告——强化学习入门特别论坛——智能体和多智能体艺术的探索会议照片RLChina介绍 RLC…

微服务--02--Nacos注册中心

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目录 服务注册和发现手动发送Http请求的方式存在问题注册中心原理 Nacos注册中心配置服务注册服务发现小结: 服务注册和发现 手动发送Http请求的方式存在问题…

京东平台双11全品类完整销售数据回顾(京东大数据-京东数据采集-京东数据接口)

今年的双十一,大家依然没有等到各大平台的官方战报。 所以,对于绝大部分品牌、商家、咨询公司乃至有数据研究需求的小伙伴来说,很难了解到今年大促消费者的真实消费水平。 为此,鲸参谋简单整理出了10个京东大类目(含5…

内测分发平台是否支持应用的微服务化部署

内测分发平台的微服务化部署支持是现代应用开发和部署的一个重要特性。首先我们得知道什么是微服务化部署都有哪些关键功能,如何实施微服务化的部署。下文以我自己理解总结了几点。 图片来源:news.gulufenfa.com 微服务是一种基于独立运行的小型服务来构建应用程序…

Java LinkedHashMap

LinkedHashMap 继承于 HashMap。在 HashMap 基础上, 维护了一条双向链表, 用来记录存入 Map 中的数据的顺序, 即存储到 Map 中的 key-value 是有序的。 解决了 HashMap 无法顺序访问的和保持插入顺序的问题。 1 LinkedHashMap 的结构定义 LinkedHashMap 是基于 HashMap 的实现…

Linux虚拟化的模式

三种虚拟化方式:完全虚拟化(Full virtualization)、硬件辅助虚拟化(Hardware-Assisted Virtualization)、半虚拟化(Paravirtualization)。 服务器上的虚拟化软件,多使用 qemu&#…

SpringCloudAlibaba之sentinel 流量卫兵(流控,熔断降级) ——详细讲解

目录 一、什么是sentinel 二、sentinel使用 1. sentinel dashboard的安装 2.启动 3.访问web界面 ​编辑 4.登录 三、sentinel 实时监控服务 1.创建项目引入依赖 2.配置 3.启动服务 4.访问dashboard界面查看服务监控 5.开发服务 6.启动进行调用 7.查看监控界面 四、senti…
最新文章