1

我想在三列中创建一个目录，用点连接它们：song.title............作者............页面

我尝试按照 catchmyfame 在 创建 CSS 中的前导点中给出的示例进行操作， 但它没有按我预期的方式工作。事实上，当我将它显示为本地磁盘文件时，它与我从我的网站获取它时是不同的错误。

这是我网站上页面的 URL：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。

4

1 回答 1

1

在您的 CSS 中尝试以下操作：

TABLE TD DIV SPAN { background-color: white; }

那应该消除重叠。

然后我会删除

#maintable td div
{
    margin-right: 1ex;
}
#maintable td+td div {
    margin-left: 1ex;
}

消除间隙。从那里开始，可能需要进行一系列细微的调整才能获得准确的间距（可能会在 SPAN 中添加一些填充以避免点“接触”。

于 2019-01-20T02:21:34.110 回答