import win.ui;
/*DSG{{*/
var winform = win.form(text="HTMLayout - Treeview 节点文本实现两端对齐";right=454;bottom=620)
winform.add()
/*}}*/
import web.layout;
var wbLayout = web.layout(winform);
wbLayout.html = /**
<widget #dd type=select>
<OPTIONS expanded>
<div>
<div .col1>某某公司</div>
<div .col2>481/674</div>
</div>
<OPTIONS>
<div>
<div .col1>经理室</div>
<div .col2>3/10</div></div>
<OPTION>
<div .col1>王经理</div>
<div .col2>(离线)</div></OPTION>
<OPTION .online>
<div .col1>张经理</div>
<div .col2>(离开)</div></OPTION>
<OPTION>
<div .col1>李经理</div>
<div .col2>(在线)</div></OPTION>
</OPTIONS>
<OPTIONS>
<div>
<div .col1>办公室</div>
<div .col2>80/94</div>
</div>
<OPTIONS id="1011@222">
<div>
<div .col1>科室一</div>
<div .col2>3/3</div>
</div>
<OPTION>
<div .col1>孟科长</div>
<div .col2>(离开)</div></OPTION>
<OPTION>
<div .col1>夏科员</div>
<div .col2>(离开)</div></OPTION>
<OPTION>
<div .col1 id="user1032" app="appname">严科员</div>
<div .col2>(离开)</div></OPTION>
</OPTIONS>
<OPTION>
<div .col1>科室二</div>
<div .col2>80/94</div></OPTION>
<OPTION>
<div .col1>科室三</div>
<div .col2>80/94</div></OPTION>
</OPTIONS>
</OPTIONS>
</widget>
**/
wbLayout.css = /**
#dd {
width:*;
height:*;
background-color:rgb(0,0,255);
}
#dd .col1 {
width:100%%;
}
#dd .col2 {
width:50px;
text-align:right;
margin-right:5px;
}
widget option span {
color:red;
text-align:right;
width:50px;
width:50px;
border:1
}
widget option {
list-marker-color:red;
width:100%%;
border:1;
line-height:14px;
flow:horizontal;
}
widget options div {
flow:horizontal;
}
#dd span {
font-size:14px;
}
#dd .online {
color:blue;
font-weight:800;
}
**/
winform.show();
win.loopMessage();