我有一个表格行，在悬停时下拉以显示其他项目。我几乎完全按照我的要求，但我似乎无法降低行高，文本行之间的空间太大。有人可以帮我解决这个问题吗？请参阅twoguysplayingzelda.com/stackoverflow上的示例。下拉行位于“系列”下。谢谢你的帮助！
.dropdown {
font-size: 12pt !important;
padding-top: 2% !important;
}
.dropdown ul {
display: none;
}
.dropdown:hover ul {
display: block;
}
/* Tables --------------------------------------- */
.post-content table {
border-collapse: collapse;
border-spacing: 0;
empty-cells: show;
font-size: 0.9em;
width: 100%;
}
.post-content th,
.post-content td {
padding: 0px;
margin: 0;
overflow: visible;
line-height: 75%;
border-top: 2px solid #000000;
border-bottom: 2px solid #000000;
}
.post-content caption {
text-align: center;
padding: 2%;
}
.post-content thead {
vertical-align: bottom;
white-space: nowrap;
}
.post-content th {
font-weight: bold;
}
table tr td a {
display: block;
height: 100%;
width: 100%;
padding: 2%;
}
td:hover {
background: #f0f0f5;
}<span id="recent-posts" style="font-size: 24pt;">Series:</span>
<table>
<tbody>
<tr>
<td class="dropdown">
Lens of Truth - Zelda Game Ranking
<ul>
<li><a href="http://twoguysplayingzelda.com/news/the-legend-of-zelda-
through-the-lens-of-truth/" target="_blank">The Legend of Zelda</a></li>
<li><a href="http://twoguysplayingzelda.com/news/zelda-ii-the-adventure-of-
link-through-the-lens-of-truth/" target="_blank">The Adventure of Link</a>
</li>
<li><a href="http://twoguysplayingzelda.com/news/a-link-to-the-past-through-
the-lens-of-truth/" target="_blank">A Link to the Past</a></li>
<li><a href="http://twoguysplayingzelda.com/news/links-awakening-through-
the-lens-of-truth/" target="_blank">Link's Awakening</a></li>
<li><a href="http://twoguysplayingzelda.com/news/ocarina-of-time-through-
the-lens-of-truth/" target="_blank">Ocarina of Time</a></li>
<li><a href="http://twoguysplayingzelda.com/news/majoras-mask-through-the-
lens-of-truth/" target="_blank">Majora's Mask</a></li>
<li><a href="http://twoguysplayingzelda.com/news/oracle-of-ages-and-oracle-
of-seasons-through-the-lens-of-truth/" target="_blank">Oracle of Ages/Oracle
of Seasons</a></li>
<li><a href="http://twoguysplayingzelda.com/news/wind-waker-through-the-
lens-of-truth/" target="_blank">Wind Waker</a></li>
<li><a href="http://twoguysplayingzelda.com/news/four-swords-through-the-
lens-of-truth/" target="_blank">Four Swords</a></li>
<li><a href="http://twoguysplayingzelda.com/news/four-swords-adventures-
through-the-lens-of-truth/" target="_blank">Four Swords Adventures</a></li>
</ul>
</td>
</tr>
<tr>
<td class="dropdown">
Top 5 Zelda - Various top 5 rankings related to the Zelda franchise
<ul>
<li><a href="http://twoguysplayingzelda.com/news/top-five-zelda-previous-
items-i-wish-were-in-breath-of-the-wild/" target="_blank">Top Five Zelda:
Previous Items I Wish Were in Breath of the Wild</a></li>
<li><a href="http://twoguysplayingzelda.com/news/top-five-zelda-enemies-i-
want-to-return/" target="_blank">Top Five Zelda: Enemies I Want To
Return</a></li>
<li><a href="http://twoguysplayingzelda.com/news/top-five-zelda-starting-
areas/" target="_blank">Top Five Zelda: Starting Areas</a></li>
<li><a href="http://twoguysplayingzelda.com/news/top-5-zelda-worthless-
facts/" target="_blank">Top 5 Zelda: Worthless Facts</a></li>
</ul>
</td>
</tr>
</tbody>
</table>
答案 0 :(得分：0)
这两条规则正在影响它。您可能希望添加一个类或重新类，这样它们不会影响您的实际帖子内容。根据需要调整它们。此外，您应该考虑完全删除表，因为这不是您呈现的表格数据。 <{1}}中的ul应该就是您所需要的。
div答案 1 :(得分：0)
这里的主要元凶是你已经应用于锚元素的填充。
.dropdown {
font-size: 12pt !important;
padding-top: 2% !important;
}
.dropdown ul {
display: none;
}
.dropdown:hover ul {
display: block;
}
/* Tables --------------------------------------- */
.post-content table {
border-collapse: collapse;
border-spacing: 0;
empty-cells: show;
font-size: 0.9em;
width: 100%;
}
.post-content th,
.post-content td {
padding: 0px;
margin: 0;
overflow: visible;
line-height: 75%;
border-top: 2px solid #000000;
border-bottom: 2px solid #000000;
}
.post-content caption {
text-align: center;
padding: 2%;
}
.post-content thead {
vertical-align: bottom;
white-space: nowrap;
}
.post-content th {
font-weight: bold;
}
table tr td a {
display: block;
height: 100%;
width: 100%;
padding: 0.5%;
}
td:hover {
background: #f0f0f5;
}<span id="recent-posts" style="font-size: 24pt;">Series:</span>
<table>
<tbody>
<tr>
<td class="dropdown">
Lens of Truth - Zelda Game Ranking
<ul>
<li><a href="http://twoguysplayingzelda.com/news/the-legend-of-zelda-
through-the-lens-of-truth/" target="_blank">The Legend of Zelda</a></li>
<li><a href="http://twoguysplayingzelda.com/news/zelda-ii-the-adventure-of-
link-through-the-lens-of-truth/" target="_blank">The Adventure of Link</a>
</li>
<li><a href="http://twoguysplayingzelda.com/news/a-link-to-the-past-through-
the-lens-of-truth/" target="_blank">A Link to the Past</a></li>
<li><a href="http://twoguysplayingzelda.com/news/links-awakening-through-
the-lens-of-truth/" target="_blank">Link's Awakening</a></li>
<li><a href="http://twoguysplayingzelda.com/news/ocarina-of-time-through-
the-lens-of-truth/" target="_blank">Ocarina of Time</a></li>
<li><a href="http://twoguysplayingzelda.com/news/majoras-mask-through-the-
lens-of-truth/" target="_blank">Majora's Mask</a></li>
<li><a href="http://twoguysplayingzelda.com/news/oracle-of-ages-and-oracle-
of-seasons-through-the-lens-of-truth/" target="_blank">Oracle of Ages/Oracle
of Seasons</a></li>
<li><a href="http://twoguysplayingzelda.com/news/wind-waker-through-the-
lens-of-truth/" target="_blank">Wind Waker</a></li>
<li><a href="http://twoguysplayingzelda.com/news/four-swords-through-the-
lens-of-truth/" target="_blank">Four Swords</a></li>
<li><a href="http://twoguysplayingzelda.com/news/four-swords-adventures-
through-the-lens-of-truth/" target="_blank">Four Swords Adventures</a></li>
</ul>
</td>
</tr>
<tr>
<td class="dropdown">
Top 5 Zelda - Various top 5 rankings related to the Zelda franchise
<ul>
<li><a href="http://twoguysplayingzelda.com/news/top-five-zelda-previous-
items-i-wish-were-in-breath-of-the-wild/" target="_blank">Top Five Zelda:
Previous Items I Wish Were in Breath of the Wild</a></li>
<li><a href="http://twoguysplayingzelda.com/news/top-five-zelda-enemies-i-
want-to-return/" target="_blank">Top Five Zelda: Enemies I Want To
Return</a></li>
<li><a href="http://twoguysplayingzelda.com/news/top-five-zelda-starting-
areas/" target="_blank">Top Five Zelda: Starting Areas</a></li>
<li><a href="http://twoguysplayingzelda.com/news/top-5-zelda-worthless-
facts/" target="_blank">Top 5 Zelda: Worthless Facts</a></li>
</ul>
</td>
</tr>
</tbody>
</table>
你有一点下拉式+手风琴式的东西，我可能会返工，因为它有点不直观。最后，我认为使用嵌套ul构建它将是一个更好的选择。 可能的工作方式如下：
ul,
li {
margin: 0;
padding: 0;
list-style: none;
}
.dropdown ul {
display: none;
padding: 5px 0;
}
.dropdown ul li {
margin-left: 2em;
padding: 3px 0;
/* line-height: 40px; */
list-style: disc;
}
.dropdown a {
line-height: 20px;
}
li:hover {
background-color: #f0f0f5;
}
li:hover>ul {
display: block;
}<h2 class="recent-posts">Series:</h2>
<ul class="dropdown">
<li>Lens of Truth - Zelda Game Ranking
<ul>
<li>
<a href="#" target="_blank" rel="noopener noreferrer">The Legend of Zelda</a>
</li>
<li>
<a href="#" target="_blank" rel="noopener noreferrer">The Adventure of Link</a>
</li>
<li>
<a href="#" target="_blank" rel="noopener noreferrer">A Link to the Past</a>
</ul>
</li>
<li>Top 5 Zelda - Various top 5 rankings related to the Zelda franchise
<ul>
<li>
<a href="#" target="_blank" rel="noopener noreferrer">Top Five Zelda:
Previous Items I Wish Were in Breath of the Wild</a>
</li>
<li>
<a href="#" target="_blank" rel="noopener noreferrer">Top Five Zelda: Enemies I Want To
Return</a>
</li>
<li>
<a href="#" target="_blank" rel="noopener noreferrer">Top Five Zelda: Starting Areas</a>
</li>
</ul>
</ul>
要调整下拉链接的行高，请修改padding CSS选择器中的line-height和/或.dropdown ul li属性。