[Typora Markdown BP] 修改文字格式、图片缩放对齐居中、Excel表格互转、手动分页、表格不分页、Mermaid自定义绘图

img
img

既有适合小白学习的零基础资料,也有适合3年以上经验的小伙伴深入学习提升的进阶课程,涵盖了95%以上C C++开发知识点,真正体系化!

由于文件比较多,这里只是将部分目录截图出来,全套包含大厂面经、学习笔记、源码讲义、实战项目、大纲路线、讲解视频,并且后续会持续更新

如果你需要这些资料,可以戳这里获取

目录

文章较长,请点击书签浏览感兴趣的内容。
CSDN的渲染与Typora未必一致,下面所有功能都在Typora上测试成功。

文章目录

前言

  • BP,即Best Practice,最佳实践,记录一些我在使用Typora时的技巧,以期帮助更多的人。
  • 标题中强调了是Typora而不是Markdown,是因为Markdown只是一种标记语言,不同的编辑器对其的渲染策略是不一样的。Typora基于Electron,本质上是一个魔改过的Chromium浏览器(不信可以用Shift+F12打开Console). 所以下面介绍的技巧很多是前端的内容,是HTML/CSS的特性发挥的作用而不是Markdown本身的特性,在其他编辑器中可能有用也可能没有用。
  • 笔者现在基本都使用Markdown来写文章,本地的编辑器基本都用Typora,无论是实验报告、个人随笔还是技术分享。期间也尝试过一些其他的方案,比如Notion,但是直到其能够完全在本地工作之前,我不会将其作为首选。
  • Markdown满足了我对写作的期待,其借助语法标记实现格式控制,而不是虚无缥缈的按钮与快捷键。并且作为文本格式,能很好地进行版本控制,也方便编写脚本来生成。编写内容基本不用抬手去碰鼠标。

全局设置

  • Typora的全局设置是通过修改css文件实现的。

    • css文件位置:选择文件->偏好设置->打开主题文件夹
    • 在这里插入图片描述
    • 如果你只想要修改某一个主题下的css属性,那么就去修改<主题名>.css
    • 如果你想让某个css属性在所有主题下都生效,那么就去修改base.user.css,如果没有,则新建该空文本文件并修改。
      • 在这里插入图片描述
  • 如果下面介绍的内容需要全局设置,笔者会特别标注。

  • 所有对于css文件的修改都需要重启Typora才能生效。

效果类

修改字体、颜色、字体大小、行高等
  • 借助CSS实现即可,可以使用<span>/<p>/<div>标签。
  • 例子:使用Consolas字体,大小为30px,行高100px,红色加粗斜体。必须标注字体才能使用其他属性
    • <span style='font: bold italic 30px/100px "Consolas"; color:red;'>Test Message</span>
    • Test Message
  • 还可以尝试更多的CSS属性,这里不再赘述。
文字居中(靠右)对齐
  • 使用了HTML的<p>标签的align属性,也可以使用CSS.

  • <p align='center'>这是一段测试文字</p>

    • 这是一段测试文字
  • 或者使用CSS的text-align属性:<p style='text-align:center'>这是一段测试文字</p>'

    • 这是一段测试文字
  • 右对齐改成将center改成right即可。

  • <p align='right'>这是一段测试文字</p>

    • 这是一段测试文字
  • <p style='text-align:right'>这是一段测试文字</p>

    • 这是一段测试文字
图片转存至相对路径
  • 这样做的好处是,无论是粘帖还是插入的本地/网络图片,都会在文档所在文件夹下的同名.assets文件夹保存副本,并且文档内插入的路径都是相对路径,方便对图片的统一管理和分享。
  • 打开文件->偏好设置->图像,选择
    • 插入图片是,赋值图片到./${filename}.assets
    • 并设置优先使用相对路径、对本地图片应用、对网络图片应用、自动转义。
    • 在这里插入图片描述
图片缩放
  • Markdown标准的插入图片语法是![](),这种语法本身并没有定义缩放,但是在Typora中,你有以下方式来做到。
  • 这是一张没有处理过的图片(Go语言的吉祥物,一只地鼠)
    • 在这里插入图片描述
  • 右击图片,选择缩放图片(非100%,选择100%是不会有改变的),Typora会将![]()改成<img>标签来实现。这是最通用的做法。
    • <img src="Typora%20Best%20Practice.assets/go_avatar.png" alt="Go Avatar" style="zoom:50%;" />
    • Go Avatar

img
img

既有适合小白学习的零基础资料,也有适合3年以上经验的小伙伴深入学习提升的进阶课程,涵盖了95%以上C C++开发知识点,真正体系化!

由于文件比较多,这里只是将部分目录截图出来,全套包含大厂面经、学习笔记、源码讲义、实战项目、大纲路线、讲解视频,并且后续会持续更新

如果你需要这些资料,可以戳这里获取

由于文件比较多,这里只是将部分目录截图出来,全套包含大厂面经、学习笔记、源码讲义、实战项目、大纲路线、讲解视频,并且后续会持续更新*

如果你需要这些资料,可以戳这里获取

  • 5
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值