html - 使用 CSS 向下移动一段文本

Question

我想将文本标签向下移动大约 6px 我正在附加样式:

.price-label{
    font-family:Arial, Helvetica, sans-serif;
    font-size:small;
    position:relative;
    bottom:-6px;
    vertical-align:bottom;
}

HTML 是:

<table border="0" cellspacing="1" cellpadding="0">
    <tr>
        <td height="45" colspan="2" align="center"><p><span class="text">Name</span><span class="name-label"></span></p></td>
        </tr>
            <tr>
                    <td>&nbsp;</td>
                    <td class="price-label">54.67</td>
                  </tr>
                  <tr>
                    <td width="28" bgcolor="#CCCCCC">&nbsp;</td>
                    <td height="45">&nbsp;</td>
                  </tr>
                  <tr>
                    <td width="28" bgcolor="#CC3300">&nbsp;</td>
                    <td height="112">&nbsp;</td>
                  </tr>
                  <tr>
                    <td width="28" bgcolor="#CCCCCC">&nbsp;</td>
                    <td height="22">&nbsp;</td>
                  </tr>
                </table>

在视觉上，我希望 54.67 标签水平平行出现 - 与灰色单元格(顶部一个)和红色单元格(顶部第二个)相交的间隙。因为数字代表左侧栏中的那个点。

因此，如果其他一些技术更好，请告诉我，也许我应该使用 DIV，这会给我更多的控制权吗？

Answer 1

如果您想向下移动它，您需要将它移动正 6px，而不是负6px，并设置< strong>top 属性，不是 bottom

position: relative;
top: 6px;