HTMLコンテンツは表示されません

-1

これは私の2'nd HTMLプロジェクトです。私はいくつかのイントロテキストを使ってポートフォリオページの上部にフルスクリーンイメージを作成しました。しかし、私が画像の下に別のdivを作って、ユーザーが下にスクロールしてより多くのコンテンツを見ることができるようにすると、そのdiv docent内に置かれたものは画面にまったく表示されます。自分で見て。HTMLコンテンツは表示されません

https://codepen.io/CarbCode/pen/KWweBL

マイコード：

HTML

<link href="https://fonts.googleapis.com/css? 

family=Lato:100|Palanquin+Dark:500" rel="stylesheet"> 
</head> 
<div id="header" class="container-fluid"> 
    <img src="https://image.ibb.co/mqxeqa/BG1.jpg" alt="BG1" class="headerBg"> 
    <h1 class="text-white" style="font-family:'Palanquin Dark'; padding-left: 5%;">Hey, I'm Carlos </h2> 
<h1 class="secondTit text-white typewriter" id="Typewrite"style="font-family:'Lato';"><i>Developer in Training/></i></h2> 
<a href="#"><p id="learnmore"style="color: #a19f9f;"><i>View my portfolio</i><br/>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&#8595;<p><a> 
</div> 
    <div class="row"> 
    <div class="block1"> 
     <i class="fa fa-free-code-camp"></i>

CSS

#header { 
    position: relative; 
} 

.headerBg { 
    position: absolute; 
    left: 0px; 
    right: 0px; 
    width: 100%; 
    hight: 85%; 
} 

.typewriter { 
    overflow: hidden; 
    white-space: nowrap; 
    margin: 0 auto; 
    letter-spacing: .01em; 
    animation: typing 2s steps(50, end), blink-caret 1.2s step-end infinite; 
} 

@keyframes typing { 
    from { 
    width: 0 
    } 
    to { 
    width: 100% 
    } 
} 

body { 
    font-family: 'Lato', sans-serif; 
    font-size: 100%; 
} 

h1 { 
    position: absolute; 
    font-size: 6rem; 
    padding-top: 16.5%; 
    padding-left: 3%; 
} 

#learnmore { 
    position: relative; 
    font-size: 3rem; 
    padding-top: 44%; 
    padding-left: 40%; 
    line-height: 0.9 
} 

.secondTit { 
    padding-top: 25%; 
    padding-left: 10%; 
}

出典

2017-02-26 Carlos A Rodriguez

コンテンツがありませんか？あなたのHTMLが途切れたように見えます。「私のポートフォリオを見る」の後にテキストが表示されません。 –

まず、コードをデバッグする必要があります。 a）あなたのコードは<head>でありません。 b）それぞれ<h1>には、終了タグとして</h2>があります。 c）あなたの「別の」divが<div class="row">を意味する場合、</div>のないコードが不完全です。あなたが使用しているCSSフレームワークわからない、あなたの質問に答えるが、私は<div class="row">はこのような<div class="container-fluid">内であるべきだと思うするには、次の新しい学習者として

<div id="header" class="container-fluid"> 
    <!-- some content --> 
    <div class="row"> 
    <!-- content for the row --> 
    </div> 
    <div class="row"> 
    <!-- content for another row --> 
    </div> 
</div>

は、CSSとHTMLを混合しない習慣を開発する必要がありますたとえば、2つのスタイルのすべてのスタイルをCSSスタイルシートにhtmlよりも置く必要があります。コードをもっときれいにします。

出典

2017-02-26 02:12:11 hcheung

HTMLコンテンツは表示されません

答えて

関連する問題