ul和li需CSS控制排版，list-style-type仅适用于ul/ol且不支持图片；重置padding/margin防错位；横排用flex或inline-block；嵌套时用层级选择器精准控制。
ul 和 li 本身不带视觉样式，浏览器默认只加圆点和缩进，真要“排版好看”，必须靠 CSS 控制；直接写 HTML 标签不加样式，基本等于没排版。
用 list-style-type 换项目符号
改符号是最基础的排版动作，但注意它只影响 ul 或单个 li，不能混用在 ol 上（ol 用 type 属性或 list-style-type 的数字/字母值）。
-
disc（实心圆点，ul默认）、circle（空心圆）、square（实心方块）最常用 - 想用自定义图标？别碰
list-style-type，它不支持图片，得用background-image+padding-left配合 -
none是清空符号的刚需操作，尤其嵌套时子ul常需要设为none再手动加 icon
用 padding-left 和 margin 控制缩进与间距
浏览器对 ul 默认有 padding-left: 40px，但这个值在不同浏览器里不一致，且会和 li 的 margin 叠加，容易导致错位。
- 统一重置：先写
ul { padding-left: 0; margin: 0; }，再按需加padding-left控制整体缩进 -
li之间留空：用margin-bottom，别依赖line-height或br，否则响应式下易塌陷 - 嵌套列表缩进要分层处理：父
ul设padding-left: 20px，子ul设padding-left: 16px，避免逐层放大
用 display: flex 或 inline-block 实现横向排列
默认 li 是块级元素，竖着排；横排不是加 float，而是现代布局方式更稳。
立即学习“前端免费学习笔记（深入）”；
- 横向菜单常见写法：
ul { display: flex; flex-wrap: wrap; }，li { margin-right: 12px; } - 如果兼容老浏览器（IE10以下），用
li { display: inline-block; vertical-align: top; }，但注意inline-block元素间有空白符，得删 HTML 换行或设font-size: 0在父级再重置 - 横向列表慎用
float: left：父ul容易高度塌陷，还得清浮动，已属过时方案
真正难的不是写几行样式，而是嵌套层级深了之后符号、缩进、对齐全乱套——这时候别硬调 padding 和 margin，优先用 ul > li > ul 这类明确选择器单独控制子列表，避免全局污染。
