566 字
3 分钟
Markdown 响应式表格
基础表格与对齐
效果
| 功能模块 | 对应状态 | 默认值 | 说明 |
|---|---|---|---|
| 动态配色 | 稳定 | 315 | 默认粉紫色色相 |
| 无刷新切页 | 启用 | true | 基于 Swup 4 框架 |
| 零额外负担 | 严格遵循 | true | 页面关闭功能时零请求零体积 |
第一列左对齐、第二三列居中、最后一列右对齐：
| 左对齐 | 居中 | 右对齐 |
|---|---|---|
| cell | cell | cell |
| 较长的单元格内容 | 中等 | 42 |
源码
| 功能模块 | 对应状态 | 默认值 | 说明 || :--- | :---: | :---: | --- || 动态配色 | 稳定 | 315 | 默认粉紫色色相 || 无刷新切页 | 启用 | true | 基于 Swup 4 框架 || 零额外负担 | 严格遵循 | true | 页面关闭功能时零请求零体积 |
| 左对齐 | 居中 | 右对齐 || :--- | :---: | ---: || cell | cell | cell |三种对齐标记：:--- 左对齐、:---: 居中、---: 右对齐。
列多时的横向滚动
效果：列数较多或内容较宽时，表格外层会自动生成响应式滚动容器，不会撑破页面视口——可以左右拖动下面这张表。
| 配置项 | 类型 | 默认值 | 作用域 | 生效时机 | 备注 |
|---|---|---|---|---|---|
themeColor.hue | number | 345 | 全站 | 构建期写入 CSS 变量 | 0–360，345 为粉色 |
banner.homeText.title | string | — | 首页 | 构建期 | 首页大标题 |
permalink.enable | boolean | false | 全站 | 构建期 | 关闭时用文件名作链接 |
comment.provider | string | none | 文章页 | 运行时按需加载 | none / twikoo / giscus |
sidebar.components | array | — | 侧栏 | 构建期 | 数组整体替换语义 |
源码
| 配置项 | 类型 | 默认值 | 作用域 | 生效时机 | 备注 || :--- | :--- | :--- | :--- | :--- | :--- || `themeColor.hue` | number | 345 | 全站 | 构建期写入 CSS 变量 | 0–360，345 为粉色 |说明
- 表格语法就是标准 GFM 表格：
|分隔单元格，第二行写对齐标记； - 构建期插件会自动注入外层响应式容器与平滑滚动样式，作者无需额外包裹；
- 单元格里可以放行内代码、链接、强调等大部分行内语法，但不能放块级内容（列表、代码块、容器）。
Markdown 响应式表格
https://www.klucen.cn/posts/博客搭建/markdown-table/分享文章
生成精美分享图或复制链接，与更多人分享本文。
继续阅读
换条路线
从其他文章中稳定抽取
最后更新于 ，距今已过 301 天
部分内容可能已过时
评论