.gradeinfo {
display:flex;
flex-flow:row nowrap;
justify-content:center;
align-items:center;
}
.htmleaf {
width:300px;
height:30px;
line-height:30px;
border-radius:15px;
box-shadow:0px 0px 1px 1px #888888 inset;
display:flex;
align-items:center;
margin-left:10px;
position:relative;
overflow:hidden;
}
.perinfo {
margin-left:2px;
height:26px;
border-radius:15px;
position:absolute;
left:0px;
}
代码比较简单,就是根据两个取值及父级的确定宽度来计算显示的子集的宽度,这在做显示等级或是进度条的时候使用