list-style: none 属性含义
在CSS（层叠样式表）中，list-style 是一个简写属性，用于设置列表项（如 <ul> 或 <ol> 中的 <li> 元素）的标记类型、位置和图像。它通常包含三个子属性：
- list-style-type：指定列表项的标记类型（例如，圆点、数字或罗马数字）。
- list-style-position：指定列表项的标记是放在列表项内部还是外部。
- list-style-image：使用一张图片作为列表项的标记。
当你将 list-style 设置为 none 时，实际上是同时重置了这三个子属性的默认值：
list-style: none;这等价于分别设置以下三个属性为它们的“无”值或默认的非显示状态：
list-style-type: none; /* 不显示任何项目符号 */ list-style-position: outside; /* 尽管此时 type 为 none，此属性仍可以设置但不影响效果 */ list-style-image: none; /* 不使用图像作为项目符号 */实际效果
- 移除项目符号：使用 list-style: none; 后，原本出现在无序列表 (<ul>) 前面的圆点和有序列表 (<ol>) 前面的数字将被完全移除。
- 自定义样式：这一属性常用于需要完全控制列表外观的场景，比如通过 CSS 的其他特性（如 ::before 或 ::after 伪元素）来添加自定义的项目符号或图标。
使用示例
假设你有一个简单的无序列表：
<ul> <li>苹果</li> <li>香蕉</li> <li>橙子</li> </ul>默认情况下，每个列表项前都会有一个圆点。如果你希望移除这些圆点并应用一些自定义样式，可以这样做：
ul { list-style: none; } ul li::before { content: "• "; /* 添加自定义的内容，这里是一个圆点和一个空格 */ color: blue; /* 改变颜色 */ font-size: 1.5em; /* 调整大小 */ }在这个例子中，尽管我们移除了默认的项目符号，但通过 ::before 伪元素为每个列表项添加了新的内容，从而实现了自定义的外观。
总之，list-style: none; 是控制列表项外观的强大工具，特别是在追求高度定制化设计的时候。
