href的简单HTML问题

时间:2010-05-10 07:27:42

标签: html image hyperlink href imagesource

我正在尝试创建超链接到某些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 个答案:

答案 0 :(得分:2)

不知道是否还有更多,但你错过了收尾报价:

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

答案 1 :(得分:2)

如果您执行以下操作,则更容易诊断,维护和调整您的网页。

  1. 将您的问题分开 - 您的HTML应描述文档,而不是其风格。将您的样式规则放入级联样式表(CSS),这也意味着您将满足下一个规则
  2. 不要重复自己。您对所有这些元素的宽度和样式规则完全相同。这意味着如果你想将宽度改为30px,你必须找到/替换这些项目(如果你自动查找和替换,你必须希望你不小心更换你不是什么意思到。
  3. 布局代码 - 通过正确地标记HTML代码,您会发现错误,例如错过结束标记,因为它会立即看起来不对。
  4. 使用validator.w3.org确保代码正确 - 这将为您发现错误,并帮助您避免代码中的两个问题 - 缺少引号和缺少结束标记。
  5. 以下是您的代码的干净版本......

    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>
    

答案 2 :(得分:1)

一个好主意是通过W3 Validator

运行代码
  

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

它会告诉您HTML的格式错误。

答案 3 :(得分:0)

您的上一个<td>标记也未正确关闭。

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

最后应为</td>而不是<td>