easyui 自适应 fit属性

来源：互联网发布：java微信推送模板消息编辑：程序博客网时间：2024/06/10 15:10

1:如果设置了fit=true就会去匹配外层的高宽

<div id="mytabs" class="easyui-tabs" fit="true" border="false"><div  title="div2"  >         <div id="xx" class="easyui-layout" fit="true" border="false">                <div region="north" title="条件" split="true" style="height:100px;padding-top:20px">              </div>                <div region="center"  style="padding:5px;background:#eee;">              </div>          </div></div> </div>

例如此时将此作为tabs的子页就会被显示，是因为tabs默认有自己的宽高，他的子页面div2是一个标题他适应呀所有layout会被显示

因为此时不管怎么设置div2的宽高都不会影响layout的宽高

但如果外层是一个普通div 没有easyui设置的默认高宽，layout就会依赖他

<div  title="div2" style="width:100px;"   >         <div id="Div2" class="easyui-layout" fit="true" border="false">                <div region="north" title="条件" split="true" style="height:100px;padding-top:20px">              </div>                <div region="center"  style="padding:5px;background:#eee;">              </div>          </div></div

所以此时div2就设置为宽度100

所以要注意如果此时div2没有设置宽高的或layout就不会显示了 -。-找了很久的原因

特别是作为tabs时的子页面要注意

也可以在第一个例子的基础上在套一个普通的div他layout能不能被显示

例如

<div id="mytabs" class="easyui-tabs" fit="true" border="false"><div  title="div2" >        <div><!--这里套一个普通div，因为他没有设置高宽所以里边的layout不会被显示-->        <div id="Div2" class="easyui-layout" fit="true" border="false">                <div region="north" title="条件" split="true" style="height:100px;padding-top:20px">              </div>                <div region="center"  style="padding:5px;background:#eee;">              </div>          </div>        </div></div> </div>

ok,事实证明不会被显示，

所以用了fit=true不要乱套div 否者-。-

1 0