1

一部の URL にハイパーリンクされた画像を作成しようとしていますが、ハイパーリンクが機能していないようです。

以下のコードをhttp://windchimes.co.in/index_w%20-%20Copy.htmlで使用しています。

アイコンへのハイパーリンクが機能しない理由を教えてください。

<td width="29" style="padding-bottom: 42px;><a href="http://windchimes.co.in/blog" target="_blank"><img align="middle" title="blog" alt="blog" src="http://dl.dropbox.com/u/529534/windchimes/icon-blog.gif"></a></td><td width="29" style="padding-bottom: 42px;> <a href="http://www.linkedin.com/groups?gid=120310" target="_blank"><img align="middle" title="linkedin" alt="linkedin" src="http://dl.dropbox.com/u/529534/windchimes/icon-linkedin.gif"></a></td><td width="29" style="padding-bottom: 42px;> <a href="http://www.facebook.com/group.php?gid=72425590275" target="_blank"><img align="middle" title="facebook" alt="facebook" src="http://dl.dropbox.com/u/529534/windchimes/icon-facebook.gif"></a></td><td width="29" style="padding-bottom: 42px;> <a href="http://twitter.com/windchimesindia" target="_blank"><img align="middle" title="twitter" alt="twitter" src="http://dl.dropbox.com/u/529534/windchimes/icon-twitter.gif"></a></td><td width="29" style="padding-bottom: 42px;> <a href="http://www.youtube.com/user/Windchimesindia" target="_blank"><img align="middle" title="Youtube" alt="Youtube" src="http://dl.dropbox.com/u/529534/windchimes/icon-youtube.gif"></a><td>
4

4 に答える 4

2

他にあるかどうかはわかりませんが、次の最後の引用符がありません。

 <td width="29" style="padding-bottom: 42px;>
                                          ^^^
于 2010-05-10T07:33:58.177 に答える
2

次のことを行うと、Web ページの診断、保守、および調整がはるかに簡単になります。

  1. 懸念事項は分けておいてください。HTML はドキュメントのスタイルではなく、ドキュメントを記述する必要があります。スタイル ルールをカスケーディング スタイル シート (CSS) に入れます。これは、次のルールも満たすことを意味します。
  2. 繰り返さないでください。これらすべての要素にまったく同じ幅とスタイルのルールがありました。つまり、幅を 30px に変更したい場合は、これらの各項目を検索/置換する必要があります (検索と置換を自動化する場合は、意図しないものを誤って置換しないようにする必要があります)に。
  3. コードをレイアウトする - HTML コードを適切にタブで移動することにより、閉じタグの欠落などのエラーを発見できます。
  4. コードが正しいことを確認するには、validator.w3.org を使用します。これにより、エラーが特定され、コード内の 2 つの問題 (引用符の欠落と終了タグの欠落) を回避するのに役立ちます。

ここにあなたのコードのきれいなバージョンがあります...

CSS:

td.myClass {
    width: 29px;
    padding-bottom: 42px;
    text-align: center;
}

そしてHTML：

<td style="myClass">
    <a href="http://windchimes.co.in/blog" target="_blank">
        <img title="blog" alt="blog" src="http://dl.dropbox.com/u/529534/windchimes/icon-blog.gif">
    </a>
</td>
<td style="myClass">
    <a href="http://www.linkedin.com/groups?gid=120310" target="_blank">
        <img title="linkedin" alt="linkedin" src="http://dl.dropbox.com/u/529534/windchimes/icon-linkedin.gif">
    </a>
</td>
<td style="myClass">
    <a href="http://www.facebook.com/group.php?gid=72425590275" target="_blank">
        <img title="facebook" alt="facebook" src="http://dl.dropbox.com/u/529534/windchimes/icon-facebook.gif">
    </a>
</td>
<td style="myClass">
    <a href="http://twitter.com/windchimesindia" target="_blank">
        <img title="twitter" alt="twitter" src="http://dl.dropbox.com/u/529534/windchimes/icon-twitter.gif">
    </a>
</td>
<td style="myClass">
    <a href="http://www.youtube.com/user/Windchimesindia" target="_blank">
        <img title="Youtube" alt="Youtube" src="http://dl.dropbox.com/u/529534/windchimes/icon-youtube.gif">
    </a>
</td>
于 2010-05-10T07:49:54.120 に答える
1

コードをW3 Validatorで実行することをお勧めします。

http://validator.w3.org/check?uri=http://windchimes.co.in/index_w%2520-%2520Copy.html

HTML の形式がどのように間違っているかがわかります。

于 2010-05-10T07:39:52.930 に答える
0

最後の<td>タグも適切に閉じられていません。

<td width="29" style="padding-bottom: 42px;>
...
<td>

</td>最後の代わりにする必要があります<td>。

于 2010-05-10T07:41:07.667 に答える