Question

我这里有营养成分表：

<div style="float: right; margin-right: 5px;">

我想减少线条的粗细，使其看起来更漂亮。

我是HTML的新手我已经尝试过更改所有内容但它无效。

我该怎么办？

Answer 1

您使用表数据元素（td）来表示该效果。因此，删除该td中的 并设置td的高度，如下所示：

<td colspan="3" style="height: 1px;" bgcolor="#000"></td>

而不是：

<td colspan="3" bgcolor="#000">&nbsp;</td>

但是你最好学习css而不是使用表格或html来进行样式设计。

Answer 2

你可以通过CSS line-height元素的高度来改变线条的粗细`高度：

.thick {
  line-height:5px;
  height:5px;
}

或者您可以使用边框而不是黑线

.border{
  border-bottom: 2px solid black;
}

此代码将放入<style></style>代码和html调用中<td colspan="3" class="thick">nbsp;</td>

#a = id="a"

.b = class="b"

也许这有助于您：http://www.cssbasics.com/introduction-to-css/

Answer 3

我会完全删除tr，如下所示：

<tr><td colspan="3">&nbsp;</td></tr>

我会将border-bottom: 1px solid;添加到td中，如下所示：

<td colspan="3" bgcolor="white"><strong>Amount Per Serving</strong></td>

以上将成为：

<td colspan="3" bgcolor="white" style="border-bottom: 1px solid;"><strong>Amount Per Serving</strong></td>

Answer 4

表标记需要重写而不是调整。删除元素为<td colspan="3" style="height: 1px;" bgcolor="#000"></td>的行。根据需要在单元格上设置border属性。要创建连续的水平线，最好删除cellspacing和cellpadding属性，在CSS中设置border-collapse: collapse并使用CSS padding属性进行合适的列对齐（到数据项之间有足够的空间。）

如何减少营养成分表中的线条厚度？

4 个答案: