MarkDown很方便,但基本语法有些不足:比如无法使用折叠语法,无法让文字有不同的颜色。

这些功能可以实现,不过需要使用Html语法进行扩展。这篇文章主要是整理一下这些技巧,方便更好的使用。

一、折叠语法:<details>标签

1.1、代码:

<details>
<summary>点击时的区域标题:点击查看详细内容</summary>
<p> - 测试 测试测试</p>
<pre><code> title,value,callBack可以缺省 </code> </pre>
</details>

summary:折叠语法展示的摘要

details:折叠语法标签

pre:以原有格式显示元素内的文字是已经格式化的文本。

blockcode:表示程序的代码块。

code:指定代码范例。

1.2、实际效果:

点击时的区域标题:点击查看详细内容

- 测试 测试测试

  title,value,callBack可以缺省    

二、其他HTML语法:

2.1 源码:

<span style='color:red'>This is red</span>   //字体颜色
<ruby> 漢 <rt> ㄏㄢˋ </rt> </ruby> // 特殊字
<kbd>Ctrl</kbd>+<kbd>F9</kbd> // 按键标识
<span style="font-size:2rem; background:yellow;">**Bigger**</span> //字体大小和背景 <font face="微软雅黑" color="red" size="6">字体及字体颜色和大小</font>
<font color="#0000ff">字体颜色</font> <p align="left">居左文本</p>
<p align="center">居中文本</p>
<p align="right">居右文本</p>

使用span或者font标签,同时用style属性控制样式。

2.2 实际效果:


This is red

漢 ㄏㄢˋ

Ctrl+F9

Bigger


字体及字体颜色和大小

字体颜色


居左文本

居中文本

居右文本

三、参考来源:

  1. markdown嵌入折叠标签 | 東引甌越 https://www.sunyazhou.com/2017/10/25/20171025markdown-skill/
  2. 让你的md文档可折叠化展示 · Issue #155 · iuap-design/blog https://github.com/iuap-design/blog/issues/155 (比上一个好点的感觉)
  3. HTML Support in Typora https://support.typora.io/HTML/#html-entities (其他的HTML语法和使用)
  4. Markdown的常用语法(个人总结) | ConnorLin's Blog http://connorlin.github.io/2016/05/06/Markdown%E7%9A%84%E5%B8%B8%E7%94%A8%E8%AF%AD%E6%B3%95(%E4%B8%AA%E4%BA%BA%E6%80%BB%E7%BB%93)/

【MarkDown】使用Html样式和折叠语法的更多相关文章

  1. Markdown_04_折叠语法

    目录 一.折叠语法 参考资料 一.折叠语法 主要使用的是 html5的 details标签 (1)示例如下: <details> <summary>折叠文本</summa ...

  2. MarkDown折叠语法

    1.语法代码 程序员的本质 程序的进阶和优化 1.简化人的操作,更少的代码做更多的事情 2.节省时间效率,在更短的时间内做更多的事情 3.占用内存,占更少的内存做更多的事情 <details&g ...

  3. markdown的css样式(自己写的)

    markdown的css样式,这些是我自己配置的,感觉可以的话你可以添加下,不适合自己的话可以仿照第二种自己写个比较好的css样式. 第一种 /* RESET ==================== ...

  4. 【blog】Markdown的css样式推荐

    参考博客 分享一款Markdown的css样式:https://www.cnblogs.com/zhangjk1993/p/5442676.html 美化Markdown输出的HTML文档:http: ...

  5. 转 .md即markdown文件的基本常用编写语法(图文并茂)

    原文链接:.md即markdown文件的基本常用编写语法(图文并茂) 序言: 很久没有写博客了,感觉只要是不写博客,人就很变得很懒,学的知识点感觉还是记不住,渐渐地让我明白,看的越多,懂的越少(你这话 ...

  6. .md 即 markdown 文件的基本常用编写语法

    0. 前言 Markdown 是一种纯文本格式的标记语言.通过简单的标记语法,它可以使普通文本内容具有一定的格式.现在的项目都使用了 git 仓库,再加上远程仓库 github 托管,那就难免要写一些 ...

  7. markdown的流程图实现和代码语法着色

    用flowchart为markdown添加流程图 举个例子如下,根据这个例子大家就能看懂我到底是怎么实现的 <!DOCTYPE html> <html> <head> ...

  8. [Markdown]纯文本标记语言MarkdowPad2--MD语法知识

    ##1.标题 代码 注:# 后面保持空格 # h1 ## h2 ### h3 #### h4 ##### h5 ###### h6 ####### h7 // 错误代码 ######## h8 // ...

  9. Markdown温故知新(4):更多扩展语法及HTML

    1.强调(删除 & 高亮) 2.脚注(注脚) 3.数学公式 4.更多扩展语法 5.终极扩展之内嵌 HTML 5.1.文本修饰类标签 5.2.内容排版类标签 5.3.图片及多媒体标签 5.4.锚 ...

随机推荐

  1. Excel去除单元格中的汉字

    Alt+F11,插入,模块 Function RemoveChinese(rng As Range) s = Len(rng.Text) For i = 1 To s txt = StrConv(Mi ...

  2. SSL and SSL Certificates Explained

    Secure Sockets Layer (SSL) and Transport Layer security (TLS ) are protocols that provide secure com ...

  3. php安全处理

    1.php.ini 修改 open_basedir='d:\wwwroot' //配置只能访问指定的网站目录 2.php.ini 修改 disable_funcitons=system,passthr ...

  4. unity, access scene ambient

    lighting面板里设置的ambient color,在shader里访问是通过UNITY_LIGHTMODEL_AMBIENT这个变量. 它定义在UnityShaderVariables.cgin ...

  5. C# LDAP

    Lightweight Directory Access Protocol OpenLDAP

  6. atitit。html css框架Bootstrap  Foundation的比较与不同 attilax大总结

    atitit.html css框架Bootstrap  Foundation的比较与不同 attilax大总结 1. Bootstrap  Foundation的比较与不同1 2. Bootstrap ...

  7. hdu 3304 Interesting Yang Yui Triangle

    hdu 3304 Interesting Yang Yui Triangle 题意: 给出P,N,问第N行的斐波那契数模P不等于0的有多少个? 限制: P < 1000,N <= 10^9 ...

  8. flink on yarn 用户代码获取keytab本地文件和principal的方法

    flink on yarn的情况下配置的keytab文件会根据每次yarn application 分配taskmanager的变化都是不一样的,在部分场景下用户代码也需要获得keytab文件在yar ...

  9. csu-1328 近似回文词 和 最长回文字符串

    原博文地址:http://blog.csdn.net/u012773338/article/details/39857997 最长回文子串 描述:输入一个字符串,求出其中最长的回文子串.子串的含义是: ...

  10. 【转】Apache虚拟主机的配置和泛解析域名的绑定

    基于IP地址的虚拟主机配置 Listen 80 DocumentRoot /www/example1 ServerName www.example1.com DocumentRoot /www/exa ...