验证尖叫我的 html 无效，但在我看来它是有效的

问题描述 投票：0回答：1

不久前，我尝试使用 VS Code 中的 Prettyfier，但结果发现我的 html 代码格式错误。对我来说，它在各方面都很完美，但其他任何网络漂亮者也表示抗议。即使智能感知也指出我的 li 结束标签也有它的开始并指出它。我的错误在哪里？

<!DOCTYPE html>
<html lang="en">
    <head>
        <!-- Required meta tags -->
        <meta charset="utf-8" />
        <meta
            name="viewport"
            content="width=device-width, initial-scale=1, shrink-to-fit=no"
        />
        <title>A Meaningful Page Title</title>

        <!-- Bootstrap CSS -->
        <link
            rel="stylesheet"
            href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
            integrity="sha384-xOolHFLEh07PJGoPkLv1IbcEPTNtaed2xpHsD9ESMhqIYd0nLMwNLD69Npy4HI+N"
            crossorigin="anonymous"
        />

    </head>
    <body class="d-flex flex-column">
        <header>
            <nav
                class="navbar navbar-expand-md navbar-light border-bottom bg-light parent"
            >
                <a class="navbar-brand" href="#">Home</a>
                <button
                    class="navbar-toggler"
                    type="button"
                    data-toggle="collapse"
                    data-target="#navbarNav"
                    aria-controls="navbarNav"
                    aria-expanded="false"
                    aria-label="Toggle navigation"
                >
                    <span class="navbar-toggler-icon"></span>
                </button>
                <div class="collapse navbar-collapse" id="navbarNav">
                    <ul class="navbar-nav w-100 d-flex">
                        <li class="nav-item">
                            <a href="#" class="nav-link active">Feature</a>
                        </li>
                        <li class="ml-auto">
              <li class="nav-item">
                <a class="nav-link active" aria-current="page" href="#">Login</a>
              </li>
              <li class="nav-item">
                <a class="nav-link active" aria-current="page" href="#">Register</a>
              </li>
            </li>
                    </ul>
                </div>
            </nav>
        </header>

    </body>
</html>

html formatting
1个回答
0
投票

列表项不能是其他列表项的直接子项。您的标记中有以下模式：

li.ml-auto > li.nav-item
，这是无效的 HTML。

列表项的允许的父项是：

<ul>
、
<ol>
或
<menu>
元素。

该错误消息不是很清楚，但这就是验证器出错的原因。

最新问题
© www.soinside.com 2019 - 2024. All rights reserved.