GitHub Pages中折叠元素内Markdown列表与段落渲染异常求助

这不是Markdown本身的细节问题，是GitHub仓库内置渲染器和GitHub Pages使用的渲染器对<details>/<summary>标签内的Markdown解析规则不一致导致的。

• GitHub仓库里的渲染器会自动解析<details>标签内的Markdown格式（段落、列表等），哪怕直接把Markdown写在标签里也能正常渲染。
• 但GitHub Pages用的渲染器（比如默认的Jekyll+kramdown），会把<details>标签里的内容当成纯HTML文本处理，不会自动解析里面的Markdown，所以段落、列表都变成了行内内容。

解决办法 #

你可以通过两种方式修复这个问题：

方法1：用<div>包裹Markdown内容 #

在<details>里的内容外层加一个<div>标签，明确告诉渲染器里面的内容需要解析Markdown：

<details>
  <summary>Power of representation</summary>
  <div>
    这里是第一个段落内容。

    这里是第二个段落内容。

    - 列表项1
    - 列表项2
  </div>
</details>

方法2：直接用HTML标签定义格式 #

把段落换成<p>标签，列表换成<ul>/<li>标签，这样两种渲染器都能正确识别格式：

<details>
  <summary>Power of representation</summary>
  <p>这里是第一个段落内容。</p>
  <p>这里是第二个段落内容。</p>
  <ul>
    <li>列表项1</li>
    <li>列表项2</li>
  </ul>
</details>

内容的提问来源于stack exchange，提问作者Humberto