我正在使用 Dojo tabContainer。
快速提问:如果您正在处理 Dojo 容器，是否必须在 CSS 中以像素为单位指定小部件大小？
从我所看到的，让 TabContainer 实际显示的唯一方法是通过 CSS 给它一个绝对大小。
更新:我发现元素 body和 html缺少 height属性，因此它被计算为 0。所以，现在如果我将它们设置为 100%，我将显示表单......但是，它将是巨大的! (只要页面)。这个想法是将其高度设置为 auto ，所以它是“只要它需要”......这甚至可能吗？
在我的 HTML 中，我有类似的内容:
...
<body>
<div id="loginForm"> </div>
</body>
...
然后我在代码中:
require(["app/widgets/LoginForm"], function( loginForm){
// Create the "application" object, and places them in the right spot.
loginForm = new LoginForm( {} , 'loginForm');
loginForm.startup();
});
LoginForm 是一个简单的基于模板的小部件，具有以下模板:
<div data-dojo-attach-point="tabContainer" data-dojo-type="app.TabFading" data-dojo-props="tabPosition:'top'" style="height:100%">
<div data-dojo-type="dijit.layout.ContentPane" data-dojo-attach-point="loginPane" data-dojo-props="title: 'Login'">
<form data-dojo-type="dijit.form.Form" data-dojo-attach-point="loginForm" method="POST">
<label for="${id}_login">Login</label>
<input name="login" id="${id}_login" data-dojo-attach-point="login" data-dojo-type="dijit.form.ValidationTextBox" data-dojo-props="required:true"/>
<label for="${id}_password">Password</label>
<input name="password" id="${id}_password0" data-dojo-attach-point="password" data-dojo-type="app.ValidationPassword" />
<input type="submit" data-dojo-attach-point="button" data-dojo-type="app.BusyButton" label="Login!" />
</form>
</div>
</div>
</div>
CSS 非常基础:
#loginForm {
width: 300px;
margin: 0 auto;
padding: 20px;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
/*** Background Gradient - 2 declarations one for Firefox and one for Webkit ***/
background: -moz-linear-gradient(19% 75% 90deg,#FCFCFC, #CCCCCC);
background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#FCFCFC), to(#CCCCCC));
/*** Shadow behind the box ***/
-moz-box-shadow:0px -5px 300px #a9a0a0;
-webkit-box-shadow:0px -5px 300px #a9a0a0;
}
body {
background-color: #fcfcfc;
font: 9pt/1.5em Helvetica Neue, Helvetica, Arial, sans-serif;
margin: 0 0;
}
我必须让 TabContainer 真正出现的唯一方法是让
height:300px在其中——否则，计算出的高度为 0。这是本来的样子吗？还是我做错了什么？
最佳答案
如果您设置了属性 doLayout在 ContentPane 或 TabContainer 上设置为 false 它应该自动调整内容的高度。 doLayout dijit 布局容器的属性默认为 true，然后需要对其应用特定的高度。
关于css - dojo 中 tabContainer 的高度，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/11876445/