Question

我在codeine.io中使用bootstrap。我已将<h1>标记移动到正文部分然后它出现但我希望它在div中，所以我可以将它居中到页面的中间。我做错了什么？

<body>
<script src="https://use.fontawesome.com/4880cded54.js"></script>
<header>
  <link href="https://fonts.googleapis.com/css?family=Cormorant+Garamond" rel="stylesheet">
  <link rel=”stylesheet” id=”font-awesome-css” href=”//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css” type=”text/css” media=”screen”>
</header>
<script src=”//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js”></script>
  <a href="#" class="back_down" style="display: inline;">
<i class="fa fa-arrow-down" aria-hidden="true"></i>
  </a>
</body>
<div>
  <ul class = "nav nav-pills">
    <li class = "pull-right">
      <a href ="#"> About Me</a>
    </li>
    <li class ="pull-right">
      <a href ="#"> Portfolio</a>
    </li>
    <li class = "pull-right">
      <a href ="#"> Get In Touch</a>
    </li>
  </ul>

  <div class = "pageOne">
    <div class="block text-center">
      <h1>Birth of A Method</h1>
    </div>
  </div>
<div class ="btnList">
  <a class="btn btn-default" href="#">Twitter</a>
  <a class="btn btn-default" href="#">Github</a>
  <a class="btn btn-default" href="#">Facebook</a>
</div>

Answer 1

请研究适当的html结构。

应该是：

<html>
  <head>
    <!--All of your links and styles-->
  </head>
  <body>
    <!--All of your content-->
   </body>
</html>

Answer 2

您的HTML代码无效。试试这个：

<!doctype html>
    <html>
    <head>
        <script src="https://use.fontawesome.com/4880cded54.js"></script>
        <link href="https://fonts.googleapis.com/css?family=Cormorant+Garamond" rel="stylesheet">
        <link rel=”stylesheet” id=”font-awesome-css” href=”//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css” type=”text/css” media=”screen”>
        <script src=”//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js”></script>
    </head>
    <body>

    <a href="#" class="back_down" style="display: inline;">
        <i class="fa fa-arrow-down" aria-hidden="true"></i>
    </a>

    <div>
      <ul class = "nav nav-pills">
        <li class = "pull-right">
          <a href ="#"> About Me</a>
        </li>
        <li class ="pull-right">
          <a href ="#"> Portfolio</a>
        </li>
        <li class = "pull-right">
          <a href ="#"> Get In Touch</a>
        </li>
      </ul>

      <div class = "pageOne">
        <div class="block text-center">
          <h1>Birth of A Method</h1>
        </div>
      </div>

        <div class ="btnList">
          <a class="btn btn-default" href="#">Twitter</a>
          <a class="btn btn-default" href="#">Github</a>
          <a class="btn btn-default" href="#">Facebook</a>
        </div>
    </div>

    </body>
    </html>

Answer 3

在你把任何东西放进去之前，你就会结束你的身体。

你也把头放在身体内......

试试这个结构：

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>

<h1>My First Heading</h1>
<p>My first paragraph.</p>

</body>
</html>

所有输入和元信息都将在标题标记之间进行，其他所有内容都应在标记之间进行。你真的不需要为你正在做的事情担心html。

Answer 4

答案很简单：将所有主要HTML移到body标记内。您还使用header代替head标记作为链接。您的代码应如下所示：

<!DOCTYPE html>
<html>  
  <head>
    <link href="https://fonts.googleapis.com/css?family=Cormorant+Garamond" rel="stylesheet">
    <link rel=”stylesheet” id=”font-awesome-css” href=”//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css” type=”text/css” media=”screen”>
  </head>

  <body>
    <div>
      <ul class = "nav nav-pills">
        <li class = "pull-right">
          <a href ="#"> About Me</a>
        </li>
        <li class ="pull-right">
          <a href ="#"> Portfolio</a>
        </li>
        <li class = "pull-right">
          <a href ="#"> Get In Touch</a>
        </li>
      </ul>

      <div class = "pageOne">
        <div class="block text-center">
          <h1>Birth of A Method</h1>
        </div>
      </div>
    </div>

    <div class ="btnList">
      <a class="btn btn-default" href="#">Twitter</a>
      <a class="btn btn-default" href="#">Github</a>
      <a class="btn btn-default" href="#">Facebook</a>
    </div>

    <script src=”//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js”></script>
    <script src="https://use.fontawesome.com/4880cded54.js"></script>
  </body>
</html>

<强>干杯

嗨！我的<h1> </h1>标签没有出现

4 个答案: