list-style不能直接作用于表格单元格（td），仅对ul、ol及display:list-item元素生效；必须在td内嵌套ul/ol，并针对ul/ol/li设置样式，重置margin、控制padding-left以避免错位。
list-style 不能直接控制表格单元格内列表的样式——它本身只作用于 <ul></ul> 或 <ol></ol> 元素，不是表格属性，也不是单元格（<td>）的 CSS 可继承样式。想在表格里显示带符号或编号的嵌套列表，得靠正确嵌套 HTML 结构 + 针对列表元素的样式。
<h3>为什么 <code>list-style 加在 <td> 上无效
<p>浏览器忽略对非列表元素设置的 <code>list-style（比如写成 td { list-style: disc; }）。这个属性只对 <ul></ul>、<ol></ol> 和设置了 display: list-item 的元素生效。表格单元格默认是 display: table-cell，不响应该声明。
正确做法：在 <td> 内写 <code><ul></ul> 或 <ol></ol>
把列表结构放在单元格内部，再用 CSS 修饰列表本身：
<td>
<ul>
<li>第一项</li>
<li>第二项</li>
</ul>
</td>
然后加样式时，目标必须是 ul 或 ol，例如：
td ul {
list-style: square;
margin: 0;
padding-left: 1.2em;
}
-
margin: 0是关键：表格单元格自带内边距，列表默认也有外边距，不重置会导致上下错位或缩进异常 -
padding-left控制符号与文字间距，比依赖浏览器默认更可控 - 嵌套列表（如
<ul></ul>里再套<ul></ul>）需单独给子列表设list-style-type，否则继承父级
常见视觉问题和应对方式
表格布局容易让列表看起来“挤”或“偏移”，尤其在小尺寸单元格中：
- 文字换行后，第二行可能不与第一行对齐 → 用
ul { line-height: 1.4; }并确保padding-left足够容纳符号 - IE 或旧版 Safari 对
list-style-position: inside支持不稳定 → 尽量用outside（默认），配合text-indent微调 - 如果需要图标替代圆点，别用
list-style-image（兼容性差且难对齐），改用::marker伪元素或背景图 +padding-left - 用
white-space: normal确保长文本正常折行，避免列表项横向溢出单元格
真正起作用的是列表元素自身的样式，不是单元格；所有调整都要落在 ul、ol、li 上，而不是 td。最容易漏掉的是重置 margin 和控制 padding-left —— 这两点没处理好，列表就会贴着单元格边缘或缩进失控。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
