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

news2024/11/22 6:03:14

优雅的使用 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.coloradmin.cn/o/1259161.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

数字IC芯片验证流程及验证工具推荐?收藏专用

验证其实是一个“证伪”的过程,从流程到工具,验证工程师的终极目的都只有一个: 发现所有BUG,或者证明没有BUG,以保证芯片功能性能的正确性和可靠性。 验证环节对于一颗芯片的重要性也是不言而喻的: 从项…

甘草书店记:2023年10月10日 星期二 晴 「甘草书店从何而来」

甘草书店记:2023年10月10日 星期二 晴 「甘草书店从何而来」 甘草书店的落地,差不多是“一瞬间”实现的。 麦田医学和公司新址园区沟通办公室租赁细节时,园区负责人谈到了一楼大厅的咖啡馆计划,而我适时地提出了一些建议和我对于…

JAVA 算法面试总结

1、二分查找 二分查找又叫折半查找,要求待查找的序列有序。每次取中间位置的值与待查关键字比较,如果中间位置 的值比待查关键字大,则在前半部分循环这个查找的过程,如果中间位置的值比待查关键字小, 则在后半部分循环…

MySQL(主从复制)

简述:主从复制,是用来建立一个和主数据库完全一样的数据库环境,称为从数据库,主数据库一般是准实时的 业务数据库、事务处理库,从库做查询库。 复制过程简单的说就是 master 将数据库的改变写入二进制日志&#xff0c…

JOSEF电流继电器 DL-33 整定范围0.5-2A 柜内安装板前接线

系列型号: DL-31电流继电器; DL-32电流继电器; DL-33电流继电器; DL-34电流继电器; 一、用途 DL-30系列电流继电器用于电机保护、变压器保护和输电线的过负荷和短路保护线路中,作为起动元件。 二、结构和原理 继电器系电磁式,瞬时动作…

电脑缺失vcruntime140_1.dll有什么办法解决,修复vcruntime140_1.dll丢失

电脑缺失vcruntime140_1.dll有什么办法解决,vcruntime140_1.dll文件的作用又是什么,这个文件有什么作用?是一个什么样的文件?如果要修复vcruntime140_1.dll文件都有什么办法能够解决呢?今天这篇文章就和大家聊一聊关于…

ProFTPD-1.3.3c Backdoor Command Execution漏洞复现+poc

https://www.whereisk0shl.top/post/proftpd-1.3.3chou-men-fen-xi https://github.com/proftpd/proftpd 在官网和官方github上找了一圈1.3.3c版本的proftpd,应该是漏洞太多,官方把下了 https://blog.csdn.net/morrino/article/details/115836400 这个文…

MySQL--InnoDB引擎

InnoDB引擎 逻辑存储引擎 表空间→段→区→页→行 Tablespace 表空间(ibd文件):一个mysql实例可以对应多个表空间,用于存储记录、索引等数据Segment 段:段分为数据段、索引段、回滚段,InnoDB是索引组织表…

山西电力市场日前价格预测【2023-11-28】

日前价格预测 预测说明: 如上图所示,预测明日(2023-11-28)山西电力市场全天平均日前电价为283.92元/MWh。其中,最高日前电价为437.70元/MWh,预计出现在17:45。最低日前电价为0.00元/MWh,预计出…

2023年最新Dev-C++下载安装以及C语言环境搭建教程(C语言入门)

文章目录 写在前面C语言简介Dev-C简介Dev-C下载安装Dev-C使用教程 写在后面 写在前面 2023年最新Dev-C下载安装以及C语言环境搭建教程,快来看看吧! C语言简介 C语言是一种通用的高级程序设计语言,由美国计算机科学家Dennis Ritchie于20世纪…

Java抽象类和接口(2)

🐵本篇文章继续对接口相关知识进行讲解 一、排序 1.1 给一个对象数组排序: class Student {public String name;public int age;public Student(String name, int age) {this.name name;this.age age;}public String toString() {return "name:…

【Axure高保真原型】3D金字塔图_移入显示数据标签

今天和大家分享3D金字塔图_移入显示数据标签的原型模板,鼠标金字塔区域时,对应区域会变绿,可以查看该区域对应的项目和数据,这个原型模板是用Axure原生元件制作的,所以无需联网,而且可以自由修改样式、交互…

Allegro层叠中的介电常数如何填写指导说明

Allegro层叠中的介电常数如何填写指导说明 在用Allegro进行PCB设计的时候,需要在cross-section中设置好每个层的信息,包括层命名,每层的厚度等等信息。如下图 一般来说,这些信息就足够了 但是对于有仿真需求或者等长设计需要使用ps作为延时单位的设计的时候,需要额外在层…

postman自动化接口测试

📢专注于分享软件测试干货内容,欢迎点赞 👍 收藏 ⭐留言 📝 如有错误敬请指正!📢交流讨论:欢迎加入我们一起学习!📢资源分享:耗时200小时精选的「软件测试」资…

Java基础小结

Java 基础小结 Java 基础概念与常识 什么是 Java ? Java 是 1995 年由 sun 公司推出的一门高级语言。 Java 的四个基本特性是面向对象、平台无关性、安全性和简单性。 具体特点如下: 简单易学。 平台无关性。 面向对象 面向对象是一种程序设计技术,以木匠工…

Docker配置Halo搭建个人博客-快速入门

Docker配置Halo搭建个人博客-快速入门 1 官方文档2 安装Halo2.1 创建Halo主目录2.2 远程下载配置文件2.3 编辑配置文件2.4 拉取最新镜像2.6 查看容器2.7 开放服务器的防火墙 3 运行3.1 运行项目3.2 停止项目 4 常见问题4.1 没有权限4.2 ommand netstart not found, did you mea…

体育网站的技术 SEO:完整指南

您熟悉体育网站管理行业的快节奏、不断变化的性质。您的网站提供最新的体育新闻和信息,包括实时比分更新。但是,如果人们不容易找到它,那么你所有的精彩内容都是徒劳的。这就是体育网站技术 SEO 综合指南的用武之地! 本指南将教您…

【axios】拦截器:axios.interceptors.request.use|axios.interceptors.response.use

文章目录 概述设置拦截器Axios 拦截器的实现任务注册任务编排任务调度 来源 概述 axios有请求拦截器(request)、响应拦截器(response)、axios自定义回调处理(这里就是我们常用的地方,会将成功和失败的回调…

论文阅读——DINOv

首先是关于给了提示然后做分割的一些方法的总结: 左边一列是prompt类型,右边一列是使用各个类型的prompt的模型。这些模型有分为两大类:Generic和Refer,通用分割和参考分割。Generic seg 是分割和提示语义概念一样的所有的物体&am…

开源四轴协作机械臂ultraArm激光雕刻技术案例!

注意安全事项 开始之前,请确保您已采取适当的安全措施,例如用于激光操作的防护眼镜、灭火器和通风良好的区域。 引言 随着科技的不断进步,激光雕刻技术已经成为当今制造行业中不可或缺的一部分。它以其高精度、高效率和广泛的材料适应性&…