Dojo学习笔记（十一）：Dojo布局――嵌套样例

<!DOCTYPEHTML>
<html>
<head>
<Metacharset="UTF-8">
<linkrel="stylesheet"href="dijit/themes/soria/soria.css">
<styletype="text/css">
html,body{
height:100%;
margin:0;
overflow:hidden;
padding:0;
}
#appLayout{
height:100%;
}
#leftCol{
width:120px;
}
.claro.demoLayout.edgePanel{
background-color:#d0e9fc;
}
</style>
<scripttype="text/javascript"src="dojo/dojo.js"djConfig="parSEOnLoad:true"></script>
<scripttype="text/javascript">
</script>
<title>GridContainer学习</title>
</head>
<bodyclass="soria">
<divclass="demoLayout"style="height:300px;width:300px"data-dojo-type="dijit.layout.BorderContainer"data-dojo-props="design:'headline'">
<divclass="demoLayout"style="height:50%"data-dojo-type="dijit.layout.BorderContainer"data-dojo-props="region:'top',splitter:true,design:'headline'">
<divclass="centerPanel"data-dojo-type="dijit.layout.ContentPane"data-dojo-props="region:'center'">center</div>
<divclass="edgePanel"data-dojo-type="dijit.layout.ContentPane"data-dojo-props="region:'bottom'">bottom</div>
</div>
<divclass="centerPanel"data-dojo-type="dijit.layout.ContentPane"data-dojo-props="region:'center'">center</div>
<divclass="edgePanel"data-dojo-type="dijit.layout.ContentPane"data-dojo-props="splitter:true,region:'left'">left</div>
<divclass="demoLayout"style="width:50%"data-dojo-type="dijit.layout.BorderContainer"data-dojo-props="region:'right',design:'headline'">
<divclass="centerPanel"data-dojo-type="dijit.layout.ContentPane"data-dojo-props="region:'center'">center</div>
<divclass="edgePanel"data-dojo-type="dijit.layout.ContentPane"data-dojo-props="region:'left'">left</div>
</div>
<divclass="edgePanel"data-dojo-type="dijit.layout.ContentPane"data-dojo-props="splitter:true,region:'bottom'">bottom</div>
</div>
<!--loaddojoandprovideconfigviadataattribute-->
<scriptsrc="dojo/dojo.js"data-dojo-config="async:true,parSEOnLoad:true"></script>
<script>
require(["dijit/layout/BorderContainer","dijit/layout/ContentPane","dojo/parser"]);
</script>
</body>
</html>
输出：
原文链接：https://www.f2er.com/dojo/291115.html
Dojo学习笔记（十一）：Dojo布局――嵌套样例

猜你在找的Dojo相关文章
