2016-11-15 4 views
-3

Я использую bootstrap в codeine.io. Я переместил тег <h1> в раздел тела, а затем он появляется, но я хочу его в 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 является недействительным. У вас есть тесный элемент body '' в середине вашего кода. – 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

Ответ довольно прост: переместите весь свой основной 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> 

Приветствия

Смежные вопросы