在VSCode中写Markdown也太爽了吧!

发布时间 - 2021-12-20 00:00:00    点击率:

之前写 md 文档都是用的 typora ,这款编辑器很简洁方便, 但是在处理图片的时候有点蛋疼,当然你可以用付费插件自动上传,但是秉着勤俭节约的特质,我就逛了逛了其他方案。然后发现其实用 vscode 写 markdown 也非常爽啊。

主题插件

这一步其实很重要,毕竟写文章,一方面是写的好,另一方面是排版好看清楚,可以说 Github 主题的 md 渲染方式是个人最喜欢的了,简洁清爽又不失专业。【推荐:vscode使用教程】

Markdown Preview Github Styling

图片自动工具

PicGo

这是一款 vscode 插件,支持快捷键将你的图片上传到远端,默认用的是图床 sm.ms(免费的)。 但是个人建议配置自己的七牛云 存储或者阿里☁️等。毕竟自己的东西更加安全可靠一些。

支持截图上传,本地上传等方式直接转化成线上地址,无需手动在图床上传再来回粘贴。

录制 Gif 工具

强烈推荐 Gifox 。当然还有 Kap,这个生成的gif太大了。

这是一款高颜而且高质量的 Gif 生成工具, 一般生成的 gif 只有几百 k。 我这篇文章基本上的 gif 图只有 100k 左右。

目录以及快捷键

Markdown All in One

支持以下功能 + 快捷键

按下 shift + command + p 可以查看。

Key Command
Ctrl+B 切换粗体
Ctrl+I 切换斜体
Alt+S 切换下划线
Ctrl+Shift+] 标题升级
Ctrl+Shift+[ 标题降级
Ctrl+M 切换数学环境
Alt+C 选中/不选中任务
Ctrl+Shift+V 切换预览
Ctrl+KV 将预览切换到侧边

截图工具

qq/微信自带的快捷功能即可。

当然如果你想要这种高大上的截图,带阴影的。

这个其实是 Mac 自带的功能。

Command + Shift + 3

这个组合键可以将当前屏幕的整个图像截取下来,然后以「屏幕快照 + 日期」的编号形式命名,并自动以.PNG 格式保存到桌面。

Command + Shift + 4

这个组合键可以截取当前屏幕上任意一块区域的图像,按完组合键即可松手,然后鼠标自动变为一个标准器,当你移动光标(用鼠标单击拖动或是在触控板上三指同时拖动)选择截取区域时,旁边会出现一个即时变化的长宽像素数值,确定后松开手势(或鼠标)即可完成截图。同样,这种操作以「屏幕快照 + 日期」的编号形式命名,并自动以.PNG 格式保存到桌面。

Command + Shift + 4 + Spacebar

如果你想完整的截取屏幕上某一个窗口的图像,可以先按完 Command + Shift + 4 的组合键,然后按下空格键(或者 Command + Shift + 4 + 空格键同时按下),光标会自动变成一个照相机图标,此时所有区域处于蒙版状态,将光标移动到目标窗口单击即可完成截图。

如果你不选择任何窗口,只是把光标放在桌面上,单击就会自动截取整个背景壁纸的图像,注意,是背景壁纸。同样,这种操作以「屏幕快照 + 日期」的编号形式命名,并自动以.PNG 格式保存到桌面。

特效

代码的阴影: carbon.now.sh/ (装 X 必备)

移动端套壳

Android、iOS、Window各种壳。

mockuphone.com/

生成的图片较大, 这张图约为1.7M。所以需要后面的图片压缩。

图片压缩

Tinypng  可以看到效果巨明显。

写到最后

大家就可以开心地装X了,有了这么些强大的工具,嗯,真香。


# vscode  # markdown  # 自己的  # 按下  # 组合键  # 这是  # 单击  # 鼠标  # 上传  # 拖动  # 自带  # 逛了 


相关栏目: 【 网站优化151355 】 【 网络推广146373 】 【 网络技术251813 】 【 AI营销90571


相关推荐: 中国移动官方网站首页入口 中国移动官网网页登录  Swift中swift中的switch 语句  Laravel怎么生成URL_Laravel路由命名与URL生成函数详解  如何在云指建站中生成FTP站点?  Laravel中间件如何使用_Laravel自定义中间件实现权限控制  Win11怎么修改DNS服务器 Win11设置DNS加速网络【指南】  大连 网站制作,大连天途有线官网?  桂林网站制作公司有哪些,桂林马拉松怎么报名?  Midjourney怎么调整光影效果_Midjourney光影调整方法【指南】  网页制作模板网站推荐,网页设计海报之类的素材哪里好?  Laravel如何配置.env文件管理环境变量_Laravel环境变量使用与安全管理  Laravel如何编写单元测试和功能测试?(PHPUnit示例)  Laravel的Blade指令怎么自定义_创建你自己的Laravel Blade Directives  Laravel队列由Redis驱动怎么配置_Laravel Redis队列使用教程  Android okhttputils现在进度显示实例代码  如何在建站宝盒中设置产品搜索功能?  电视网站制作tvbox接口,云海电视怎样自定义添加电视源?  Laravel如何与Inertia.js和Vue/React构建现代单页应用  Laravel怎么实现搜索功能_Laravel使用Eloquent实现模糊查询与多条件搜索【实例】  Laravel中的withCount方法怎么高效统计关联模型数量  java获取注册ip实例  Laravel如何使用Telescope进行调试?(安装和使用教程)  大同网页,大同瑞慈医院官网?  手机网站制作平台,手机靓号代理商怎么制作属于自己的手机靓号网站?  Gemini怎么用新功能实时问答_Gemini实时问答使用【步骤】  Laravel怎么连接多个数据库_Laravel多数据库连接配置  如何选择可靠的免备案建站服务器?  如何在 Telegram Web View(iOS)中防止键盘遮挡底部输入框  如何用y主机助手快速搭建网站?  佐糖AI抠图怎样调整抠图精度_佐糖AI精度调整与放大细化操作【攻略】  标题:Vue + Vuex 项目中正确使用 JWT 进行身份认证的实践指南  如何在阿里云部署织梦网站?  如何在 Go 中优雅地映射具有动态字段的 JSON 对象到结构体  如何挑选优质建站一级代理提升网站排名?  Laravel如何实现邮件验证激活账户_Laravel内置MustVerifyEmail接口配置【步骤】  为什么要用作用域操作符_php中访问类常量与静态属性的优势【解答】  Win11怎样安装网易有道词典_Win11安装词典教程【步骤】  如何快速启动建站代理加盟业务?  如何在Tomcat中配置并部署网站项目?  如何使用 Go 正则表达式精准提取括号内首个纯字母标识符(忽略数字与嵌套)  如何选择PHP开源工具快速搭建网站?  Laravel控制器是什么_Laravel MVC架构中Controller的作用与实践  成都品牌网站制作公司,成都营业执照年报网上怎么办理?  Laravel如何实现数据导出到CSV文件_Laravel原生流式输出大数据量CSV【方案】  Python高阶函数应用_函数作为参数说明【指导】  谷歌浏览器下载文件时中断怎么办 Google Chrome下载管理修复  魔方云NAT建站如何实现端口转发?  Laravel怎么清理缓存_Laravel optimize clear命令详解  HTML 中动态设置元素 name 属性的正确语法详解  网站建设保证美观性,需要考虑的几点问题!