2016-10-19 13 views
1

私は学校の割り当てのためにHTMLコードを書き始めました。私は<section>,<article>などのHTML5セマンティクスを使いたいと思っていました。しかし、私は、これらのタグに置かれたときに見出しのサイズに特有のものに遭遇しました(下記参照)。私はその後、セマンティクスをHTMLだけに変更して、それは<div>であり、見出しは正常に機能しました。状況を明らかにするためにいくつかのスクリーンショットを投稿します。 <div>タグとHTML5見出しが正しく機能していない

最初のコードのみ

<!DOCTYPE html> 
<html> 
<head> 
    <title> 
     Curriculum Vitae 
    </title> 
</head> 
<body> 
<div> 
    <h1>Curriculum Vitae</h1> 
</div> 
<div> 
    <h2>Personal Information</h2> 
    <ul> 
     <ol><strong>Name: </strong>Haroon Rasheed Ramay</ol> 
    </ul> 
</div> 
</body> 
</html> 

The heading sizes appear to work properly within in the div tags

次は他の誰かがTかどうかを確認してもらえHTML5セマンティクス

<!DOCTYPE html> 
<html> 
<header> 
    <title> 
     Curriculum Vitae 
    </title> 
</header> 
<body> 
<article> 
    <section> 
     <h1>Curriculum Vitae</h1> 
    </section> 
    <section> 
     <h2>Personal Information</h2> 
     <ul> 
      <ol><strong>Name: </strong>Haroon Rasheed Ramay</ol> 
     </ul> 
    </section> 
</article> 
</body> 
</html> 

Note here in this picture I have used the same heading tags for Curriculum Vitae and Personal Information but the heading sizes seemed to have switched?!

を使用してコードであります彼は私だけの問題だと思っているのですか、まったく間違った方法でHTML5のセマンティックタグを使っていて、見出しの特異な振る舞いを引き起こしていますか?

P.S. HTMLドキュメントやチュートリアルのためのリンクは素晴らしいだろう(現在は私がudacityでオンライン& w33schoolsをコースを学習し、被写体としての学校でよ)

答えて

4

あなたはheadheaderタグを混合しています。彼らは非常に異なっています。

すべてのHTMLページにはheadタグが必要です(ただし、ブラウザには通常、見つからない場合は挿入されます)。

headerタグは、ページのコンテンツの見出しとして、タイトルなどとして使用されます。オプションで、の中にbodyタグがあります。 article、または他の「メインコンテンツタグ」の前にある可能性があります。

+0

とで説明してくれてありがとうございました。しかし、見出しタグの固有の振る舞いは、それでもやり直す必要はありません。 –

+0

@HaroonRamay仕事の後にもう一度見ていきます。 – Carcigenicate

+0

@ハロン・ラマイこの答えを見て、それは自分のスタイルを設定しているブラウザのようですhttp://stackoverflow.com/a/22898717/3711733 – mguida

関連する問題