Html 如何在td标签内制作动态内容全高的标签

我有一个加载动态内容的表格，我希望单元格内的内容与单元格的高度相同！确切地说，我在td单元格中有一些带有文本的“a”元素。当单元格中的文本很长且换行时会出现问题，就像您在图像中看到的那样，表行中的其他“a”元素不适合单元格的整个高度

看现场直播

这是密码

HTML

表格{
宽度：400px；
}
运输署署长{
背景：#ff0；
显示：块；
填充：20px；
框大小：边框框；
身高：100%；
宽度：100%；
}
运输署{
身高：100%；
位置：相对位置；
}

资料
蒂托洛
塞德
西塔

您必须定义TD的高度，否则浏览器不知道要考虑的100%：

td {
    height:100px;
    position: relative;
}

---

这是我过去使用过的一个小技巧

实际上，您可以向

a

元素添加一个伪元素，并将其相对于最近的

td

元素进行绝对定位。由于伪元素本质上是

a

元素的子元素，因此当您单击伪元素时，您无意中单击了

a

元素

---

这是动态内容，所以我不能只设定一个固定的高度是的，但他说他希望内容与单元格“相同高度”：将单元格背景设置为黄色也不能解决问题；如果不定义单元格，他无法预先知道单元格的高度，至少不能使用CSS OnlyTanks！但是，如果我必须为“a”元素添加一些边框，我仍然会遇到同样的问题！我可以将边框添加到“td”元素中，但作为参考，这个问题没有具体的解决方案吗？@Manuel你不能将边框添加到伪元素中吗？

table{
    width:400px;
}
td a{
    background:#ff0;
    display: block;
    padding:20px;
    box-sizing:border-box;
    height: 100%;
    width: 100%;
}

td{
    height:100%;
    position: relative;
}

td {
    height:100px;
    position: relative;
}

td a:after, td a:before {
  content: '';
  position: absolute;
  top: 0; right: 0;
  bottom: 0; left: 0;
}
td a:after {
  background: #ff0;
  z-index: -1;
}