我想在三列中创建一个带有连接点的目录： 歌曲。标题.........作者...........页面
我尝试遵循catchmyfame给出的示例 Create leading dots in CSS 但是它没有按我期望的方式工作。实际上，当我将其显示为本地磁盘文件时，与从网站上获取该文件时，完全不同。
这是我网站上页面的网址： http://conchord.org/xeno/ix.fsm.html
这是我的CSS：
<style type="text/css">
<!--
#maintable div {
background: url('dot.gif') repeat-x bottom;
}
#maintable td div
{
margin-right: 1ex;
}
#maintable td+td div {
margin-left: 1ex;
}
#maintable td+td div,
#maintable td+td+td div {
padding-right: 0;
}
#maintable td+td+td div {
text-align: right;
background-color: #fff;
}
#maintable .nodots div,
background: solid #fff;
text-align: right;
}
#maintable div span {
background-color: #fff;
}
#maintable td div span,
#maintable td div span.nodots {
background-color: white;
}
table#maintable tr td+td+td { background-color: white; }
-->
</style>
以及本节的开头：
<body>
<h2>
Index of songs in <i>The Filksong Manual</i>
</h2>
<table id="maintable">
<tr>
<td>
<div><span>Ballad of Rhysling, The</span></div>
</td>
<td>
<div><span>Roger Scime</span></div>
</td>
<td>
<div><span class="nodots">92 </span></div>
</td>
</tr>
注意：我不希望引导点完全到达下一列：我希望它们在下一列开始之前停在2em左右，因此在CSS中填充2em。
答案 0 :(得分：1)
在CSS中尝试以下操作：
TABLE TD DIV SPAN { background-color: white; }
那应该消除重叠。
然后我将删除
#maintable td div
{
margin-right: 1ex;
}
#maintable td+td div {
margin-left: 1ex;
}
消除间隙。从那里开始，可能会进行一系列较小的调整以获得确切的间距（也许在SPAN上添加一些填充，以避免点“接触”。