2017-05-14 15 views
0

として表示されている:。画像の後に空白が、次のHTMLを考えるリンク

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <title></title> 
 
    <meta charset="utf-8" /> 
 
</head> 
 
    <body> 
 
    <div style="background-color:red"> 
 
     <a href="1__mose_info.htm"> 
 
     <img src="../img/info.png" alt="Info zum ersten Buch Mose" title="Info zum ersten Buch Mose" /></a><a href="1__mose.htm">1. Mose</a> 
 
    </div> 
 
    <div style="background-color:green"> 
 
     <a href="1__mose_info.htm"> 
 
     <img src="../img/info.png" alt="Info zum ersten Buch Mose" title="Info zum ersten Buch Mose" /> 
 
     </a> 
 
     <a href="1__mose.htm"> 
 
     1. Mose 
 
     </a> 
 
    </div> 
 
    </body> 
 
</html>

私が「1」の前に(なしリンクの下線たいと最初の分割が表示されますが、もし私は2番目のdivのようにフォーマットします.1の前のスペースはリンクのアンダーラインになります。

よく見ると、 '1'の前のスペースのリンクは画像のリンクですテキストのリンク このスペースをリンクの一部として持たない方が簡単でしょうか?

[編集私の2 upvotes後とれる好ましい答えを選択:]

だから、すべてのHTML要素および/または1行でアンカー要素にカウントしたテキストを維持するためのベストプラクティスである - 少なくとも最初の単語。 次のhtmlソースコードを編集する際にこれを念頭に置いておきます。

ありがとうございます。 Wolfgang

+0

;: は、次のHTMLを考えますすべての空白が1つの空白文字に集約され、その1つの空白文字が(意図的に)保存されます。 "1"の前にスペースを入れたくない場合は、HTMLからスペースを削除してください。 –

答えて

1

改行はHTMLのスペースとしてカウントされます。あなたは、同じフォーマットを維持するために、このにそれを変更する必要があります:あなたがいないHTMLフォーマットに注目している場合

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <title></title> 
 
    <meta charset="utf-8" /> 
 
</head> 
 
<body> 
 
    <div style="background-color:red"> 
 
     <a href="1__mose_info.htm"><img src="../img/info.png" alt="Info zum ersten Buch Mose" title="Info zum ersten Buch Mose" /></a><a href="1__mose.htm">1. Mose</a> 
 
    </div> 
 
    <div style="background-color:green"> 
 
     <a href="1__mose_info.htm"> 
 
      <img src="../img/info.png" alt="Info zum ersten Buch Mose" title="Info zum ersten Buch Mose" /></a><a href="1__mose.htm">1. Mose</a> 
 
    </div> 
 
</body> 
 
</html>

は、あなたがこれを克服するために何ができるかの詳細についてはこちらをご覧くださいあなたのページの表示に影響を与えます:Removing whitespace between HTML elements when using line breaks

+0

@Garrett Kadillakの答えに以下で述べるように、それは同じであるようです:-) –

1
+0

あなたと@webbmが同じ解決策に答えたようですが、私は答えとして1つしか選択できません –