colspan 和图像不起作用答案

【问题标题】：colspan and image not workingcolspan 和图像不起作用
【发布时间】：2018-03-09 15:06:10
【问题描述】：

帮助！我在这里拉头发。我正在尝试 a) 在该表的第一行和第三行中执行 colspan，但它似乎不起作用。我希望两行都跨越三列，并且 b）我无法显示图像，我已经在网上进行了广泛的搜索，并对我找到的所有建议进行了故障排除（图像和页面文件在同一个文件夹中，没有编码错误...）。有什么想法吗？谢谢！这是我的代码：

<!DOCTYPE html> 
<html> 
<head> 
<title>table.htm</title> 
<style> table { width:90%; } 
td { width:33%; text-align:center; height:100px; } 
table { font-family:verdana, sans serif; text-align:center; }  
</style> 
</head> 
<body> 
<table>   
<tr bgcolor=“green”><td colspan=“3”><b>Table</b></td></tr>   
<tr><td>HTML coding</td><td><img src=“garlic.jpg” alt=“Garlic”></td>
<td>is fun</td></tr>   
<tr bgcolor=“#CCCCCC”><td colspan=“3”><i>Garlic</i></td></tr> 
</table> 
</body> 
</html>

【问题讨论】：

只是一个后续 - 感谢所有评论 colspan 问题的人；现在已经修复了！但是，仍然在图像中挣扎。我研究了卷曲和直引号，我很确定这些是直的，不是吗？如果他们不是，我怎么找到那些？我在我的 Mac 上使用 TextEdit，这是非常基本的。我尝试过使用单引号，但这并没有改变任何东西。再次感谢。
好的，另一个更新。图像已修复，但老实说，我不明白为什么我所做的第一次编码不起作用。有人对我有解释吗？谢谢，如果你这样做。

标签： html css image html-table

【解决方案1】：

您的问题实际上是您在标记中的属性值周围使用卷曲引号，这完全不起作用（这是 W3 规范：https://www.w3.org/TR/html4/intro/sgmltut.html#h-3.2.2）。将它们更改为直引号（单引号或双引号），您就可以做生意了;-)

【讨论】：

谢谢。但是，当我查看引号时，它们看起来很直。您有使用基本文本编辑器的经验吗？例如，我将如何在 TextEdit (mac) 等程序上指示直曲与卷曲？对这张图片有什么想法吗？
K，其他人已经修复了图像。但我不确定为什么我的原始编码不起作用。你对此有什么想法吗？谢谢，如果是的话。
不确定 TextEdit，但在 Microsoft word 之类的东西中，它默认将直引号更改为弯引号，因此可能值得关注。我可以告诉你，你的原始帖子肯定有花引号，所以如果你从实际代码中复制它，你就会遇到问题。您可以尝试在线寻找免费的代码编辑工具，它可以保证您不会遇到此类问题（并有助于代码提示和断开的链接）。

【解决方案2】：

JSFIDDLE

***更新...没关系...绝对是引号...我刚刚在 cmets 中做了一个更新的 jsfiddle ****

问题是您在 colspan 周围有引号。你只需要这个号码。

  <table>   
  <tr bgcolor=“green”>
    <td colspan=3><b>Table</b></td>
  </tr>   
  <tr>
    <td>HTML coding</td>
    <td><img src=“garlic.jpg” alt=“Garlic”></td>
    <td>is fun</td>
  </tr>   
  <tr bgcolor=“#CCCCCC”>
    <td colspan=3><i>Garlic</i></td>
  </tr> 
</table>

【讨论】：

您的回答包含错误的引号。将它们更改为直引号并添加回 OP 代码中错误的引号。
啊...好点...我只是复制并粘贴到 jsfiddle :)
这里是更新后的小提琴..jsfiddle.net/5dm0gLkh/3 ...顺便说一句...这到底是怎么回事...我最近才在研究差异。
太酷了！非常感谢。 colspan 现在正在工作！耶。图像仍然不是。不知道什么是直引号。会检查出来。再次感谢大家:)

【解决方案3】：

<!DOCTYPE html> 
<html> 
<head> 
<title>table.htm</title> 
<style> table { width:100%; } 
td { text-align:center; height:100px; } 
table { font-family:verdana, sans serif; text-align:center; }  
</style> 
</head> 
<body> 
<table>   
<tr bgcolor=“green” >
   <td  colspan="3"><b>Table</b></td>
 </tr>   
<tr>
  <td>HTML coding</td>
  <td><img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQNh8uaHeF_N7ObwLeNGBVAEIIh8l3qcSjcU2hPqvyR6-V4GEJk" alt="Garlic"></td>
  <td>is fun</td>
 </tr>   
<tr bgcolor=“#CCCCCC”>
  <td  colspan="3"><i>Garlic</i></td>
</tr> 
</table> 
</body> 
</html>

【讨论】：

好的，现在完美了！非常感谢！你做了什么？我还尝试使用 URL 链接到在线照片，但无法正常工作！ ??
不起作用。我想更改您的代码。 - 将 “ 更改为 ”