使用Bootstrap开发网站时页面顶部出现多余>符号的解决求助

你遇到的左上角多余“>”符号，是HTML代码里的语法错误导致的，具体问题出在两处：

• 引入Bootstrap CSS的link标签末尾多了冗余代码：原代码里的">会被浏览器解析成可见的">，其中的>就是你看到的多余符号。
• 导航栏的折叠div标签未正确闭合：<div class="collapse navbar-collapse" id="navbarTogglerDemo02">的闭合标签只写了</div，缺少>，会导致HTML结构异常。

修正后的核心代码片段如下：

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <title>TinDog</title>
  <link rel="stylesheet" href="css/styles.css">
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
</head>
<body>
  <section id="title">
    <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
      <a class="navbar-brand" href="">tindog</a>
      <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarTogglerDemo02" aria-controls="navbarTogglerDemo02" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
      </button>
        
      <div class="collapse navbar-collapse" id="navbarTogglerDemo02">
        <ul class="navbar-nav ml-auto">
            <li class="nav-item">
                <a class="nav-link" href="">Contact</a>
            </li>
            <li class="nav-item">
                <a class="nav-link" href="">Pricing</a>
            </li>
            <li class="nav-item">
                <a class="nav-link" href="">Download</a>
           </li>
        </ul>
      </div>
    </nav>
  </section>
</body>
</html>

内容的提问来源于stack exchange，提问作者shaik shahensha