HTML嵌套ol列表怎么做？二级结构编写指南-html教程-PHP中文网

应使用CSS counter实现嵌套ol接续编号，因HTML默认重置内层计数；通过counter-reset、counter-increment和counters()函数可生成如“3.1”“3.2”的多级序号，但需注意语义合理性与导出兼容性。

html嵌套ol列表怎么做？二级结构编写指南

直接用 <ol></ol> 套 <ol></ol> 就行，但浏览器默认会重置内层编号起点，不继承外层序号 —— 这是多数人写错的核心原因。

ol嵌套后编号从1开始，怎么让它接续上级？

浏览器对嵌套 <ol></ol> 的默认行为是：每个新 <ol></ol> 都从 1 重新计数，不管它在第几级。比如外层第3项里的子列表，仍显示“1.”“2.”，而不是“3.1”“3.2”。

纯 HTML 无解 —— <ol></ol> 标准不支持自动接续编号（CSS Counter 也不直接支持跨层级递增）
若需视觉上“3.1”“3.2”，必须用 CSS counter-reset + counter-increment 手动构造
简单场景下，更推荐改用 <ul></ul> 做二级，避免编号语义干扰（比如导航、步骤说明以外的场合）

用 CSS counter 实现真正的多级序号（如 1.1、1.2、2.1）

这是唯一能可靠生成带点分隔多级编号的方式，但要注意：它不改变 DOM 结构，只控制显示。

Wechat Article Html

将 Markdown 文章转换为微信公众号兼容的纯 HTML 格式。当用户要求"转成微信格式"、"生成公众号文章 HTML"、"排版到微信草稿箱"、"微信粘贴格式"时触发。输出带内联样式的纯 HTML，微信编辑器可直接渲染，无需额外适配。支持标题、段落、列表、粗体、行内代码、表格、引用块、代码块、配图的完整转换。

下载

外层 <ol></ol> 设 counter-reset: section，每项 <li> 用 counter-increment: section
内层 <ol></ol> 设 counter-reset: subsection，其 <li> 用 counter-increment: subsection
用 ::before 拼接内容：content: counters(section, ".") ". "
注意：counters() 第二个参数是分隔符，不是小数点字符本身；它会自动插入

ol { counter-reset: section; }
ol > li { counter-increment: section; }
ol > li::before { content: counters(section, ".") ". "; }

ol ol { counter-reset: subsection; }
ol ol > li { counter-increment: subsection; }
ol ol > li::before { content: counters(section, ".") "." counters(subsection, ".") ". "; }