一、折叠语法

主要使用的是 html5details标签

(1)示例如下:

<details>
<summary>折叠文本</summary>
此处可书写文本
嗯,是可以书写文本的
</details> <details>
<summary>折叠代码块</summary>
<pre><code>
System.out.println("虽然可以折叠代码块");
System.out.println("但是代码无法高亮");
</code></pre>
</details> <details>
<summary>折叠代码块</summary>
<pre><blockcode>
System.out.println("虽然可以折叠代码块");
System.out.println("但是代码无法高亮");
</blockcode></pre>
</details>

(2)效果如下:

折叠文本

此处可书写文本
嗯,是可以书写文本的

折叠代码块

System.out.println("虽然可以折叠代码块");
System.out.println("但是代码无法高亮");

(3)解读

  • details:折叠语法标签
  • summary:折叠语法展示的摘要
  • pre:以原有格式显示元素内的文字是已经格式化的文本
  • code:指定代码块

参考资料

  1. 【MarkDown】使用Html样式和折叠语法
  2. 让你的md文档可折叠化展示 #155

Markdown_04_折叠语法的更多相关文章

  1. 【MarkDown】使用Html样式和折叠语法

    MarkDown很方便,但基本语法有些不足:比如无法使用折叠语法,无法让文字有不同的颜色. 这些功能可以实现,不过需要使用Html语法进行扩展.这篇文章主要是整理一下这些技巧,方便更好的使用. 一.折 ...

  2. MarkDown折叠语法

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

  3. markdown 常用语法总结 - 个人版

    这里并不是要总结所有的 markdown 语法,只是总结笔者自己撰写博客时常用的一些 markdown 语法. 1 图片设置 1.1 设置图片位置 利用markdown在编写文档时插入图片是默认靠左, ...

  4. Markdown中实现折叠代码块

    <details> <summary>展开查看</summary> <pre><code> System.out.println(" ...

  5. rand ----MATLAB (经典)

    最近一直在学习matlab,我相信有一些同学已经发现,最近更新的关于matlab的内容比较多, 希望能够帮助到未来的小学弟学妹们! 永远爱你们的 ----新宝宝 rand 均匀分布的随机数全页折叠 语 ...

  6. MATLAB——画图(经典)

    今天我发现一个非常奇怪的事情,如果你喜欢一样东西或者说是要干一件事,并不一定要把它所在领域的所有都做好, 只要做好你喜欢的就可以了,正如现在的我,突然想学习MATLAB(想画图)那么你只要把一些基础的 ...

  7. markdown种嵌入html标签,实现自定义样式

    转:https://www.cnblogs.com/buwuliao/p/9578918.html -------------------------------------------------- ...

  8. polyfit 多项式曲线拟合matlab

    polyfit 多项式曲线拟合 全页折叠 语法 p = polyfit(x,y,n) [p,S] = polyfit(x,y,n) [p,S,mu] = polyfit(x,y,n)   说明 示例 ...

  9. interp1一维数据插值在matlab中的用法

    转载:https://ww2.mathworks.cn/help/matlab/ref/interp1.html?s_tid=srchtitle#btwp6lt-2_1 interp1 一维数据插值( ...

随机推荐

  1. 一个辅助AWVS C段扫描的小php脚本

    小菜写的小脚本,大牛轻拍砖~~~~~~ 渗透前信息收集时喜欢用椰树来获取旁站及二级域名,然后根据二级.三级域名地址扩展C段,扩大扫描业务边界.例如 以联想为例 但,各个旁站对应IP可能不同,或有CDN ...

  2. Pivot 和 Global 的一些总结

      相信大家一定有在 Unity 編輯器上看到這樣功能 這邊會跟大家說明這項功能有什麼用處     Pivot  意思為,輔助編輯的工具標示,會顯示在第一個選取的物件身上. Center 意思為,輔助 ...

  3. QML Image Element

    QML Image Element The Image element displays an image in a declarative user interface More... Image元 ...

  4. c++第三十一天

    p159~p164:switch语句1.例程:统计文本中五个元音字母出现的次数.(利用输入输出重定向测试) $ a <input.txt>output.txt #include <i ...

  5. CSS 图像拼合技术

    CSS 图像拼合技术 一.图像拼合 图像拼合就是单个图像的集合. 有许多图像的网页可能需要很长的时间来加载和生成多个服务器的请求. 使用图像拼合会降低服务器的请求数量,并节省带宽. 二.图像拼合 - ...

  6. clientWidth offsetWidth scrollWidth

    网页可见区域宽: document.body.clientWidth;网页可见区域高: document.body.clientHeight;网页可见区域宽: document.body.offset ...

  7. JavaScript校验网址

    JavaScript校验网址 var linkUrl = 'https://www.baidu.com' if( typeof (linkUrl) != undefined && li ...

  8. FactoryBean

    总结自:https://www.cnblogs.com/davidwang456/p/3688250.html Spring中有两种类型的Bean,一种是普通Bean,另一种是工厂Bean,即xxxF ...

  9. React Native区分安卓/iOS平台

    import { Platform, } from 'react-native'; alert(JSON.stringify(Platform)): android手机弹出:{"OS&quo ...

  10. [BZOJ4756]Promotion Counting

    Description The cows have once again tried to form a startup company, failing to remember from past ...