HTML如何制作多级菜单？嵌套下拉列表怎么实现？

这是一个陷阱。
别相信。

HTML 结构使用嵌套的 / 。
CSS使用定位和显示来控制显示。
JavaScript 管理键盘和移动设备。

不要这样做，先看一下例子。

html中list的用法

说实话，当我第一次理解HTML列表时，我认为它比我想象的要复杂，尤其是嵌套时，很容易陷入困境。
我有一个遇到麻烦的客户项目。
这显然是一种对产品进行分类的方法，但事实证明它的嵌套列表太深了。
后来我改的时候，差点把整个团队都逼疯了。

无序列表 ( ) 最有用的地方是导航栏。
我之前接管了一个旅游网站，他们的类别菜单就起到了作用。
每个主类别都有一个 ，而其中的子类别则有一个 。
当时我也想为什么不使用有序列表。
事实证明，用户根本不关心这些类别的顺序，使用无序列表更清晰。
type 属性实际上非常有用。
例如，在某些设计中使用时，将默认点更改为正方形可以产生良好的结果。

有组织的列表 (
    ) 是我最常使用的步骤指南。
    例如，我曾经写过一个教程网站，教用户如何使用某个软件。
    它必须使用有序列表。
    从第一步到第十步，如果突然变成无序列表，用户肯定会一头雾水。
    当时我也尝试过使用 type="A" 创建大写字母数字，这真的很有趣，但后来我发现存在一些兼容性问题，现在我倾向于使用 CSS 控件。

    筑巢是对耐心的考验。
    在我的一个项目中，产品类​​别嵌套在三个级别中，最终我什至忘记了哪个级别是父级。
    说实话，当时我不明白为什么这么复杂。
    然后小组中的一个人提醒我，它实际上可以分解并用作几组独立的列表，结果突然变得清晰多了。
    我也遇到过可访问性陷阱。
    有一次，当我在一个活动页面上工作时，列表是随意嵌套的。
    因此，当用户在移动设备上查看时，屏幕阅读器会卡住。
    最后，他们必须使用 CSS 重新排列它。

    现在回想起来，使用列表其实省去了很多麻烦。
    我最近创建的电子商务详细信息页面以无序列表列出了产品位置，每个位置前面都有一个 ✓。
    用户报告说，它比密集的段落更容易阅读。
    我很少使用有序列表，但在创建课程页面时，学习路径会按有序列表进行组织，并且效果非常好。
    其实说到底，关键还是看场景，不要为了炫技而把清单弄得太复杂。

    我记得的数据是，目前9 5 %以上的网站都使用列表，但我个人没有使用过具体比例看一下。
    我还没有深入研究过，所以我建议你看看最新的报告。
    不管怎样，我的经验是，如果你流利地使用列表，内容的组织自然就会清晰。

    HTML如何设置列表项样式？li的value属性作用是什么？

    设置列表项的样式主要是通过CSS来实现的。
    标签类型可以改变，使用list-style-type。
    全圆盘、空心圆盘、方方正方。
    数字、字母和罗马数字也可以。
    图像标签使用列表样式图像。
    要自定义标签，首先list-style:none。
    伪元素::控制之前。
    使用 padding-left 来设置间距。
    使用 Flexbox 或 Grid 进行复杂布局。
    value 属性仅适用于有序列表。
    指定有序列表中的起始编号。
    使用 UL 中的值无效。
    误解一：谨慎使用默认标记方向的边距。
    最佳实践：伪元素+padding-left。
    误解2 ：不要用div代替ul/ol。
    最佳实践：使用 ul/ol 保留语义。
    嵌套列表样式，使用分层选择。
    ulul 设置第二层的样式。
    可以通过组合 CSS 和 value 来控制效果。
    你自己掂量一下吧。

    html中怎么调整列表符号样式 list-style详解

    结论： 1 、通过CSS菜单样式属性修改HTML菜单样式。
    2 .列表样式类型：定义标记类型，如圆盘、圆形、方形等。
    3 . list-style-position：控制标记的位置，外部还是内部。
    4 . 列表样式图像：用图像替换默认标签。
    5 . 菜单样式快捷属性：类型→位置→图像。
    6 .去掉默认样式：list-style:none； +左填充：0；。
    7 .自定义标签：在伪元素前使用::。
    8 . 高级编号：CSSC计数器、复位和计数器递增。
    9 、兼容性：主流浏览器支持，老版本IE需要额外测试。
    1 0.建议：简单需求直接设置，复数使用CSSCcounters，注意老版本IE的兼容性。