当前位置:网站首页>Markdown tricks
Markdown tricks
2020-11-06 21:19:00 【itread01】
` Label , It's easy to use them in Markdown Implement code block folding in . ````html
post-signature.js
```javascript // Build essay signatures import { pageName } from '@tools' import { getBlogname, getCurrentPostUrl } from '@cnblog' import { postSignatureConfig } from '@config/plugins' const containerId = 'post-signature' /** * Building containers */ const buildContainer = () => { const author = getBlogname() const href = getCurrentPostUrl() const el = `
The author of this article :${author}
This article links :${href}
` $('#cnblogs_post_body').append(el) } /** * Build copyright information * @param {Boolean} enableLicense * @param {String} licenseName * @param {String} licenseLink */ const buildLicense = ( enableLicense, licenseName, licenseLink, ) => { if (!enableLicense) return const agreement = licenseName.length ? licenseName : ' Knowledge sharing signature - Non commercial use - No deduction 2.5 Mainland China ' const el = `
Copyright notice : This work adopts ${agreement} License agreement to license .
` $(`#${containerId}`).append(el) } /** * Build custom content * @param {Array} content */ function buildContent(content) { let el = '' for (let i = 0; i < content.length; i++) { el += '
' + content[i] + '
' } $(`#${containerId}`).append(el) } export default devOptions => { const { enable, enableLicense, content, licenseName, licenseLink, } = postSignatureConfig(devOptions) if (!enable) return if (pageName() !== 'post') return buildContainer() buildLicense(enableLicense, licenseName, licenseLink) buildContent(content) } ```
````
post-signature.js
```javascript // Build essay signatures import { pageName } from '@tools' import { getBlogname, getCurrentPostUrl } from '@cnblog' import { postSignatureConfig } from '@config/plugins' const containerId = 'post-signature' /** * Building containers */ const buildContainer = () => { const author = getBlogname() const href = getCurrentPostUrl() const el = `
The author of this article :${author}
This article links :${href}
` $('#cnblogs_post_body').append(el) } /** * Build copyright information * @param {Boolean} enableLicense * @param {String} licenseName * @param {String} licenseLink */ const buildLicense = (enableLicense, licenseName, licenseLink) => { if (!enableLicense) return const agreement = licenseName.length ? licenseName : ' Knowledge sharing signature - Non commercial use - No deduction 2.5 Mainland China ' const el = `
Copyright notice : This work adopts ${agreement} License agreement to license .
` $(`#${containerId}`).append(el) } /** * Build custom content * @param {Array} content */ function buildContent(content) { let el = '' for (let i = 0; i < content.length; i++) { el += '
' + content[i] + '
' } $(`#${containerId}`).append(el) } export default devOptions => { const { enable, enableLicense, content, licenseName, licenseLink } = postSignatureConfig(devOptions) if (!enable) return if (pageName() !== 'post') return buildContainer() buildLicense(enableLicense, licenseName, licenseLink) buildContent(content) } ```
You can even fold anything , Just put `` Replace the contents between tags with other contents to be folded . > Please note , stay `` Leave a blank line above and below the content between tags . ### Reference blocks stay Markdown In general, through `>` To announce a Markdown Reference blocks : > This is a reference block . But their styles are fixed , We often need reference blocks with hints , Like the following : ![image.png](https://cdn.nlark.com/yuque/0/2020/png/745037/1604657982597-f2a41d59-fbaa-4619-afac-f4b02de675fc.png#align=left&display=inline&height=548&margin=%5Bobject%20Object%5D&name=image.png&originHeight=548&originWidth=834&size=28692&status=done&style=none&width=834) stay Markdown In aid of HTML and CSS It can also be done . ```html
《 Red and black 》 yes 19 A monument to French and European literature in the 20th century . The novel focuses on the protagonist Yulian's personal struggle and two love experiences , It reveals the turbulent class struggle in the period of restoration Dynasty , Reflecting the political darkness 、 Church corruption , The broad picture of life in which the noble reactionary and the bourgeoisie's lust for profit are imbued . Yu Lian's two love motives are based on love possession, and finally achieve their own political goals .
```
《 Red and black 》 yes 19 A monument to French and European literature in the 20th century . The novel focuses on the protagonist Yulian's personal struggle and two love experiences , It reveals the turbulent class struggle in the period of restoration Dynasty , Reflecting the political darkness 、 Church corruption , The broad picture of life in which the noble reactionary and the bourgeoisie's lust for profit are imbued . Yu Lian's two love motives are based on love possession, and finally achieve their own political goals .
## Tools I chose the language sparrow as the main tool . ### Insert a picture It's very easy to insert pictures with a finch ,Crtl+ c Copy the picture ,Crtl + v Post the picture directly to the content , It will automatically help you upload to the language bird's server . Or you can use the illustration button on the toolbar , Select local image to insert . I usually use windows Self contained screenshot tool ( Shortcut key :win+ shift+s) Take a screenshot and post , Because the screenshot tool will automatically copy the image to the cutting board . stay mac There are similar solutions . ![Video_2020-11-06_163206.gif](https://cdn.nlark.com/yuque/0/2020/gif/745037/1604651748114-d2f66e6d-f3c1-47e2-bf20-505d967564ff.gif#align=left&display=inline&height=282&margin=%5Bobject%20Object%5D&name=Video_2020-11-06_163206.gif&originHeight=282&originWidth=640&size=1753415&status=done&style=none&width=640) ### Insert table stay markdown It's very cumbersome to insert tables into , But it's very easy in a finch : Click the insert button , Slide the mouse to select the number of rows and columns the table needs to have , It can automatically help you generate . ![Video_2020-11-06_163953.gif](https://cdn.nlark.com/yuque/0/2020/gif/745037/1604652194203-4bfaafde-0739-45f4-89ea-2f4e01e59fc3.gif#align=left&display=inline&height=480&margin=%5Bobject%20Object%5D&name=Video_2020-11-06_163953.gif&originHeight=480&originWidth=509&size=2001308&status=done&style=none&width=509) You can also add or delete columns and rows, and set the alignment of the table content at any time during the editing process . ### Insert formula Mathematical formulas are just needed for some people , Language sparrow supports insertion LaTeX The formula . The important thing is , The platform you want to release may not support rendering markdown The mathematical formula . Voice sparrow support is exporting markdown Check export when you want LaTeX The formula is picture . ![image.png](https://cdn.nlark.com/yuque/0/2020/png/745037/1604652657472-6825c238-c2c1-4220-a278-fe617ecdc81d.png#align=left&display=inline&height=364&margin=%5Bobject%20Object%5D&name=image.png&originHeight=364&originWidth=639&size=19428&status=done&style=none&width=639) ### Making mind maps Usually , Insert a mind map into markdown The following steps may be required : 1. Open mind mapping tool xmind wps etc. 2. Start making mind maps 3. Use screenshots or export images as pictures 4. Upload the picture to the picture bed to get the picture link 5. Use markdown Syntax insert picture To use a language bird, you just need to : 1. Directly in markdown Make mind map in 1. Automatically convert to picture when exporting > It's just as easy to insert a flowchart . ### Export The language bird can export the content as Markdown Source code , Seamless connection to other communities , I just release the content to the blog Garden , No problems have been found at present . You can go through my [ Invitation link ](https://www.yuque.com/login?platform=wechat&inviteToken=d97efa6c62973d671ad88d38b9b4d9c9b62201921c22c6bfc60ec5889295e00d) Add words or direct [ Join in ](https://www.yuque.com/). Thank you for reading !
post-signature.js
```javascript // Build essay signatures import { pageName } from '@tools' import { getBlogname, getCurrentPostUrl } from '@cnblog' import { postSignatureConfig } from '@config/plugins' const containerId = 'post-signature' /** * Building containers */ const buildContainer = () => { const author = getBlogname() const href = getCurrentPostUrl() const el = `The author of this article :${author}
This article links :${href}
Copyright notice : This work adopts ${agreement} License agreement to license .
` $(`#${containerId}`).append(el) } /** * Build custom content * @param {Array} content */ function buildContent(content) { let el = '' for (let i = 0; i < content.length; i++) { el += '' + content[i] + '
' } $(`#${containerId}`).append(el) } export default devOptions => { const { enable, enableLicense, content, licenseName, licenseLink, } = postSignatureConfig(devOptions) if (!enable) return if (pageName() !== 'post') return buildContainer() buildLicense(enableLicense, licenseName, licenseLink) buildContent(content) } ```post-signature.js
```javascript // Build essay signatures import { pageName } from '@tools' import { getBlogname, getCurrentPostUrl } from '@cnblog' import { postSignatureConfig } from '@config/plugins' const containerId = 'post-signature' /** * Building containers */ const buildContainer = () => { const author = getBlogname() const href = getCurrentPostUrl() const el = `The author of this article :${author}
This article links :${href}
Copyright notice : This work adopts ${agreement} License agreement to license .
` $(`#${containerId}`).append(el) } /** * Build custom content * @param {Array} content */ function buildContent(content) { let el = '' for (let i = 0; i < content.length; i++) { el += '' + content[i] + '
' } $(`#${containerId}`).append(el) } export default devOptions => { const { enable, enableLicense, content, licenseName, licenseLink } = postSignatureConfig(devOptions) if (!enable) return if (pageName() !== 'post') return buildContainer() buildLicense(enableLicense, licenseName, licenseLink) buildContent(content) } ```` Leave a blank line above and below the content between tags . ### Reference blocks stay Markdown In general, through `>` To announce a Markdown Reference blocks : > This is a reference block . But their styles are fixed , We often need reference blocks with hints , Like the following : ![image.png](https://cdn.nlark.com/yuque/0/2020/png/745037/1604657982597-f2a41d59-fbaa-4619-afac-f4b02de675fc.png#align=left&display=inline&height=548&margin=%5Bobject%20Object%5D&name=image.png&originHeight=548&originWidth=834&size=28692&status=done&style=none&width=834) stay Markdown In aid of HTML and CSS It can also be done . ```html
《 Red and black 》 yes 19 A monument to French and European literature in the 20th century . The novel focuses on the protagonist Yulian's personal struggle and two love experiences , It reveals the turbulent class struggle in the period of restoration Dynasty , Reflecting the political darkness 、 Church corruption , The broad picture of life in which the noble reactionary and the bourgeoisie's lust for profit are imbued . Yu Lian's two love motives are based on love possession, and finally achieve their own political goals .
```
《 Red and black 》 yes 19 A monument to French and European literature in the 20th century . The novel focuses on the protagonist Yulian's personal struggle and two love experiences , It reveals the turbulent class struggle in the period of restoration Dynasty , Reflecting the political darkness 、 Church corruption , The broad picture of life in which the noble reactionary and the bourgeoisie's lust for profit are imbued . Yu Lian's two love motives are based on love possession, and finally achieve their own political goals .
## Tools I chose the language sparrow as the main tool . ### Insert a picture It's very easy to insert pictures with a finch ,Crtl+ c Copy the picture ,Crtl + v Post the picture directly to the content , It will automatically help you upload to the language bird's server . Or you can use the illustration button on the toolbar , Select local image to insert . I usually use windows Self contained screenshot tool ( Shortcut key :win+ shift+s) Take a screenshot and post , Because the screenshot tool will automatically copy the image to the cutting board . stay mac There are similar solutions . ![Video_2020-11-06_163206.gif](https://cdn.nlark.com/yuque/0/2020/gif/745037/1604651748114-d2f66e6d-f3c1-47e2-bf20-505d967564ff.gif#align=left&display=inline&height=282&margin=%5Bobject%20Object%5D&name=Video_2020-11-06_163206.gif&originHeight=282&originWidth=640&size=1753415&status=done&style=none&width=640) ### Insert table stay markdown It's very cumbersome to insert tables into , But it's very easy in a finch : Click the insert button , Slide the mouse to select the number of rows and columns the table needs to have , It can automatically help you generate . ![Video_2020-11-06_163953.gif](https://cdn.nlark.com/yuque/0/2020/gif/745037/1604652194203-4bfaafde-0739-45f4-89ea-2f4e01e59fc3.gif#align=left&display=inline&height=480&margin=%5Bobject%20Object%5D&name=Video_2020-11-06_163953.gif&originHeight=480&originWidth=509&size=2001308&status=done&style=none&width=509) You can also add or delete columns and rows, and set the alignment of the table content at any time during the editing process . ### Insert formula Mathematical formulas are just needed for some people , Language sparrow supports insertion LaTeX The formula . The important thing is , The platform you want to release may not support rendering markdown The mathematical formula . Voice sparrow support is exporting markdown Check export when you want LaTeX The formula is picture . ![image.png](https://cdn.nlark.com/yuque/0/2020/png/745037/1604652657472-6825c238-c2c1-4220-a278-fe617ecdc81d.png#align=left&display=inline&height=364&margin=%5Bobject%20Object%5D&name=image.png&originHeight=364&originWidth=639&size=19428&status=done&style=none&width=639) ### Making mind maps Usually , Insert a mind map into markdown The following steps may be required : 1. Open mind mapping tool xmind wps etc. 2. Start making mind maps 3. Use screenshots or export images as pictures 4. Upload the picture to the picture bed to get the picture link 5. Use markdown Syntax insert picture To use a language bird, you just need to : 1. Directly in markdown Make mind map in 1. Automatically convert to picture when exporting > It's just as easy to insert a flowchart . ### Export The language bird can export the content as Markdown Source code , Seamless connection to other communities , I just release the content to the blog Garden , No problems have been found at present . You can go through my [ Invitation link ](https://www.yuque.com/login?platform=wechat&inviteToken=d97efa6c62973d671ad88d38b9b4d9c9b62201921c22c6bfc60ec5889295e00d) Add words or direct [ Join in ](https://www.yuque.com/). Thank you for reading !
版权声明
本文为[itread01]所创,转载请带上原文链接,感谢
边栏推荐
- window系统 本机查找端口号占用方法
- 事务的本质和死锁的原理
- Introduction to the development of small game cloud
- Hdu3974 assign the task segment tree DFS order
- 意外的元素..所需元素..
- ES6 learning notes (4): easy to understand the new grammar of ES6
- Axios learning notes (2): easy to understand the use of XHR and how to package simple Axios
- 2020-09-03:裸写算法:回形矩阵遍历。
- Pn8162 20W PD fast charging chip, PD fast charging charger scheme
- 嘉宾专访|2020 PostgreSQL亚洲大会阿里云数据库专场:曾文旌
猜你喜欢
What knowledge do Python automated testing learn?
Understanding formatting principles
An article will take you to understand CSS alignment
行为型模式之解释器模式
华为Mate 40 系列搭载HMS有什么亮点?
ES6 learning notes (4): easy to understand the new grammar of ES6
Zero basis to build a web search engine of its own
MongoDB与SQL常用语法对应表
实用工具类函数(持续更新)
Top 5 Chinese cloud manufacturers in 2018: Alibaba cloud, Tencent cloud, AWS, telecom, Unicom
随机推荐
All the way, I was forced to talk about C code debugging skills and remote debugging
The native API of the future trend of the front end: web components
C and C / C + + mixed programming series 5 - GC collaboration of memory management
An article takes you to understand CSS3 picture border
From overseas to China, rancher wants to do research on container cloud market
大会倒计时|2020 PostgreSQL亚洲大会-中文分论坛议程安排
Helping financial technology innovation and development, atfx is at the forefront of the industry
Use modelarts quickly, zero base white can also play AI!
GitHub: the foundation of the front end
Ronglian completed US $125 million f round financing
如何在终端启动Coda 2中隐藏的首选项?
What is alicloud's experience of sweeping goods for 100 yuan?
How does filecoin's economic model and future value support the price of fil currency breaking through thousands
Event monitoring problem
ado.net和asp.net的关系
C language I blog assignment 03
Understanding formatting principles
A small goal in 2019 to become a blog expert of CSDN
2020年数据库技术大会助力技术提升
Road to simple HTML + JS to achieve the most simple game Tetris