2016-11-15 11 views
-3

私はcodeine.ioでブートストラップを使用しています。 <h1>タグをbodyセクションに移動して表示されますが、divの中に配置してページの中央に配置することができます。私は間違って何をしていますか?こんにちは!私の<h1></h1>タグが表示されません

<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> 
+8

あなたのHTMLは無効です。あなたのコードの途中に、末尾の本体要素 ''があります。 – j08691

+2

「」にない場合は表示されません。 –

+0

doctypeを忘れないでください! –

答えて

4

正しいhtml構造を調べてください。

は次のようになります。

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

0

無効であなたの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> 
0

あなたは何かを入れる前に体を終わらせます。ヘッダータグの間に移動します

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

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

</body> 
</html> 

あなたの入力し、メタ情報のすべて、および他のすべては行く必要があります。また

あなたの体の内側にあなたのヘッダーを入れて...

この構造を試してみてくださいボディータグの間。あなたは何をしているのかについてhtmlについて心配する必要はありません。

0

答えはとても簡単です:bodyタグの中にすべてのメインHTMLを移動してください。また、リンクにはheadタグの代わりにheaderを使用しました。あなたのコードは次のようになります必要があります。

<!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> 

乾杯

関連する問題