dojo中tabContainers的高度

2024-05-05

我正在使用 Dojo tabContainer。 快速问题:你吗?have to如果您正在处理 Dojo 容器,请在 CSS 中指定小部件大小(以像素为单位)? 据我所知,让 TabContainer 实际显示的唯一方法是通过 CSS 为其指定绝对大小。

UPDATE:我发现元素body and 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 时,它​​应该自动调整内容的高度。这doLayoutdijit 布局容器的属性默认为 true,这需要对其应用特定的高度。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

dojo中tabContainers的高度 的相关文章