覆盖继承的 CSS 高度答案

【问题标题】：Override Inherited CSS Height覆盖继承的 CSS 高度
【发布时间】：2017-01-01 05:09:31
【问题描述】：

我为表格定义了一种样式。然后我有一个.tablestyle th { height:26px } ...

我现在需要让表格中的特定（不是全部）th 自动确定其高度。

<table class="tablestyle">
<tr><th>Normal Stuff</th></tr>
<tr><th>Long Stuff</th></tr>
</table>

长的东西需要 x 的高度，其中 x > 26px，但未知...我尝试在 th 标签上放置一个样式属性，说height:auto，但它似乎不尊重自动任务。如果我将height: 200px 放在样式属性中，它可以正常工作，达到 200 像素。问题是我真的需要根据内容来确定高度...

我意识到我可以制作更具体的样式，我很好。如果可能的话，我希望只装饰受影响的标签而不是创建单独的样式。

附加信息：
这是一个表格数据输入表单，我们也同样需要 td 标签。

【问题讨论】：

标签： css layout html-table

【解决方案1】：

尝试在你的 css 属性末尾添加 !important

height: 500px !important;

【讨论】：

【解决方案2】：

min-height: 26px;

适用于除 IE 之外的所有应用程序。对于 IE，我通常使用一些 jQuery：

if ($('stuff').height() < 26) { $('stuff').height(26); }

我想，我面前没有我的代码。

【讨论】：

【解决方案3】：

我知道您的体验与我自己的不同，但通常一个表格单元格（<th> 或 <td>）将采用显示内容所需的任何高度，而不管与 @ 相关的样式规则如何987654324@或overflow。

您使用的是文档类型吗？我通常在我的页面中使用<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">，演示页面（在this page）似乎支持这一点。

那里的页面使用以下标记：

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
    <title></title>
    <link rel="stylesheet" type="text/css" href="css/stylesheet.css" />

    <style type="text/css" media="all">

table   {width: 80%;
    margin: 1em auto;
    }

    tr,th,td
        {height: 40px;
        }

    th, td  {border: 1px solid #f90;
        }

    </style>

</head>

<body>

<table>

<thead>
<tr><th>Names</th><th>Description</th><th>Actor</th></tr>
</thead>

<tbody>
<tr><td>Number One</td><td>The assumed leader of the Village</td><td>Perhaps Patrick McGoohan</td></tr>
<tr><td>Number Two</td><td>There are two Number Twos with repeat appearances: Leo McKern appeared in three episodes, and Colin Gordon in two. With the exception of "Fall Out", this was the result of the actors performing their roles in two consecutive episodes filmed back to back. Colin Gordon was filmed in "The General" followed immediately with "A. B. and C." McKern was featured in the series' second transmitted episode, "The Chimes of Big Ben," and then featured in the next production episode to be filmed "Once Upon a Time." Three actors who portray Number Twos also appear in other episodes, possibly as different characters — Georgina Cookson ("A. B. and C." as party guest and "Many Happy Returns" as Mrs Butterworth/No. 2), Kenneth Griffith ("The Girl Who Was Death" as Schnipps/No. 2 and "Fall Out" as The Judge) and Patrick Cargill ("Many Happy Returns" as Thorpe, and "Hammer Into Anvil" as No. 2) — although this is ambiguous, particularly in the case of Kenneth Griffith's character.</td><td>Patrick McGoohan</td></tr>
</tbody>

</table>

</body>

</html>

可以想象，您可以将单元格内容包装在 <span> 中，并使用它来强制执行特定的高度/宽度；但它确实会使您的标记复杂化。

【讨论】：