custom markdown table column width solutions All In One

custom markdown table column width solutions All In One

自定义 markdown 表格列宽

default ❌

长文本被挤成了错乱的多行 ❌

|步骤|图解|
|--|--|
| git merge 产生新的 `merge commi`t, <br/> 同时触发 `prepare-commit-msg` 的  git hooks | ![](https://img2022.cnblogs.com/blog/740516/202210/740516-20221027180150431-1570070083.png) |
| SourceTree 图解 | ![](https://img2022.cnblogs.com/blog/740516/202210/740516-20221027180717949-1747815363.png) |

步骤	图解
git merge 产生新的 merge commit, 同时触发 prepare-commit-msg 的 git hooks
SourceTree 图解

solutions

solution 1. 表头，设置 width ✅

|<div style="width: 320px">步骤</div>|图解|
|--|--|
| git merge 产生新的 `merge commi`t, <br/> 同时触发 `prepare-commit-msg` 的  git hooks | ![](https://img2022.cnblogs.com/blog/740516/202210/740516-20221027180150431-1570070083.png) |
| SourceTree 图解 | ![](https://img2022.cnblogs.com/blog/740516/202210/740516-20221027180717949-1747815363.png) |

步骤	图解
git merge 产生新的 merge commit, 同时触发 prepare-commit-msg 的 git hooks
SourceTree 图解

solution 2. 单元格，设置 width ✅

|步骤|图解|
|--|--|
|<div style="width: 320px">git merge 产生新的 `merge commi`t, <br/> 同时触发 `prepare-commit-msg` 的  git hooks </div>| ![](https://img2022.cnblogs.com/blog/740516/202210/740516-20221027180150431-1570070083.png) |
| SourceTree 图解 | ![](https://img2022.cnblogs.com/blog/740516/202210/740516-20221027180717949-1747815363.png) |

步骤	图解
git merge 产生新的 merge commit, 同时触发 prepare-commit-msg 的 git hooks
SourceTree 图解

HTML 标签 + CSS style

1. div width， 表头 ✅

markdown columns width is determined by the longest cell in the column,

markdown 列的宽度由列中最长的单元格决定 ??? 表头的宽度决定的 ???

| <div style="width:290px">property</div> | description  |
| -- | ---- |
| `border-bottom-right-radius`  | Defines the shape of the bottom-right |

2. img width, 单元格 ✅

|Name|Value|
|----|---------|
|<img width=200/>|<img width=500/>|
|<div style="width:290px">property</div>| ??? |

refs

https://stackoverflow.com/questions/36121672/set-table-column-width-via-markdown

https://arcticicestudio.github.io/styleguide-markdown/rules/tables.html#prefer-lists

---

---

©xgqfrms 2012-2021

www.cnblogs.com/xgqfrms 发布文章使用：只允许注册用户才可以访问！

原创文章，版权所有©️xgqfrms, 禁止转载 🈲️，侵权必究⚠️！

---