html - HTML 表格：间距超链接

Question

我需要帮助，我被困在最琐碎的事情上！我的课堂作业是制作一个网站，我已经完成了模板上的基本布局，但我被困在超链接表上。

我无法让超链接在每个表格设置之间有间隙！相反，结果是所有单词（带空格），但所有空格都带有下划线！

（注意字有下划线） Kinda_Like_This

这是我的代码：

    <style type="text/css">
    table {position:relative; top:15px;left:15px; letter-spacing:5px;}
bottomTable {position:relative; top:100px;left:16px;}

<table>
    <td><a href="http://www.foxnews.com">  Foxnews </a></td>
<td><a href="http://www.pbs.org">PBS </a></td>
<td><a href="http://www.bing.com"> Bing </a></td>
<td><a href="http://www.google.com"> Google </a></td>
<td><a href="http://www.blogger.com"> Blogger </a></td>

我一直在http://www.w3schools.com/cssref/tryit.asp?filename=trycss_background-image尝试过。关于我做错了什么有什么建议吗？

Answer 1

在锚点之外添加空格，如下所示：

<td> <a href="http://www.foxnews.com">Foxnews</a> </td>

Answer 2

您必须使用padding而不是，letter-spacing并且您没有正确结束样式标签

演示

css

table {        
    top:15px;
    left:15px;     
  }

td{
padding:10px;
}

HTML

<table>
    <td><a href="http://www.foxnews.com">  Foxnews </a></td>
    <td><a href="http://www.pbs.org">PBS </a></td>
    <td><a href="http://www.bing.com"> Bing </a></td>
    <td><a href="http://www.google.com"> Google </a></td>
    <td><a href="http://www.blogger.com"> Blogger </a></td>
</table>

Answer 3

使用填充在超链接和文本装饰之间建立距离：如果有下划线，则无删除

a {
text-decoration: none;
}

table {
position:relative; 
border: 1px solid red; 
top: 10px; 
left: 10px;
}

td {
padding: 10px;
}

bottomTable {
position:relative;
top:100px;
left:16px;
}