html - 如何在css和html中设置div的高度

Question

我正在使用 Twitter 引导程序。我在我的html中写道：

<div style="height:100px;" class="span12">
asdfashdjkfhaskjdf
</div>

为什么打开该页面时高度不是100px？

对于后代，原始代码是：<div height="100px">

score 110 · Accepted Answer

要编写内联样式，请使用：

<div style="height: 100px;">
asdfashdjkfhaskjdf
</div>

内联样式是有目的的，但是在大多数情况下不建议这样做。

更“正确”的解决方案是制作一个单独的 CSS 表，将其包含在您的 HTML 文档中，然后使用 ID 或类来引用您的 div。

如果你有文件结构：

index.html
>>/css/
>>/css/styles.css

然后在你的 HTML 文件之间<head>写</head>：

<link href="css/styles.css" rel="stylesheet" />

然后，将您的 div 结构更改为：

<div id="someidname" class="someclassname">
    asdfashdjkfhaskjdf
</div>

在 css 中，您可以从 ID 或 CLASS 中引用您的 div。

为此，请编写：

.someclassname { height: 100px; }

或者

#someidname { height: 100px; }

请注意，如果您同时执行这两种操作，则文件结构更靠后的那个将是实际工作的那个。

例如...如果您有：

.someclassname { height: 100px; }

.someclassname { height: 150px; }

那么在这种情况下，高度将为 150px。

编辑：

要从您的编辑中回答您的次要问题，可能需要overflow: hidden;or overflow: visible;。你也可以这样做：

<div class="span12">
    <div style="height:100px;">
        asdfashdjkfhaskjdf
    </div>
</div>

score 22 · Accepted Answer

<div style="height: 100px;"> </div>

或者

<div id="foo"/> and set the style as #foo { height: 100px; }
<div class="bar"/> and set the style as .bar{ height: 100px;  }

2 回答 2