2017-06-04 7 views
-1

私の質問はかなり初心者ですが、とにかく私が間違っていることを理解できません。基本的には、ヘッダーとして使用する<div>を作成し、その中に画像(ロゴ)とタイトル(<h1>を使用)を含む別の<div>を作成しました。h1はテキストの上に不要なスペースを作成します

問題は、私は私が<h1>タイトルを取り除く場合は、すべてがうまくている身体 as you can see in this picture. 上の不要な余分なスペースを得るということです。 floatプロパティを割り当てないとスペースが消えますが、画像がfloat: left;とタイトルが「整列」されていない場合は、as you can seeを削除すると、問題は画像に割り当てられたfloat: left;プロパティに起因すると思います。だから、問題は、浮動小数点数のプロパティを使用せずに、イメージをイメージの左側のタイトルと右側のタイトルにするにはどうすればいいですか?

ありがとうございます、ありがとうございます!

編集:皆様お返事ありがとうございます。私は学校でHTMLとCSSを勉強しています。このようなことは私の先生からはほとんど言及されていません。ありがとうございました

+0

これは折りたたみ余白と呼ばれています。https://www.w3.org/TR/CSS21/box.html#collapsing-margins – CBroe

答えて

1

デフォルトでは、h1要素に余白があります。

margin: 0; 

h1要素のスタイルを変更するだけです。

0

あなたはこれを使用することができます。

<h1 style="margin-top:0px; padding-top:0px">some text</h1> 
+0

埋め込みはページ要素を押し上げるのではなく、h1要素のテキストの周りのスペースを広げるだけです –

0

があなたの仕事の開始時に、あなたが余裕のスタイルをクリアする必要があります(ブラウザはそれらのいくつかを適用します)。開発者の多くは同じようcssファイルを開始

h1 { 
    margin: 0; 
} 

:だからCSSファイルの書き込みの開始に 明確にそれのための

* { 
margin: 0; 
padding: 0; 
} 

を:) はまた、あなたは、CSSのリセットについて何かを読んでくださいとCSS標準化:

0

これは、すべてのブラウザにデフォルトのスタイルシートがあるためです。これはBrowsers' default CSS stylesheetsにあります。ご覧のとおり、デフォルトのマージンはゼロではありません。これは、明示的にmargin: 0pxをCSSに追加することで解決できます。

関連する問題