首先表单使用的格式是lable加input,通过设置lable的float和text-align属性即可实现对齐
具体代码如下
css:
label {
float: left;
margin-top: 10px;
font-size: 20px;
text-align: right;
width: 200px;
}
html:
<ul id="formUl">
<li>
<label>姓名:</label>
<select id="name" name="employee.id" class="form-control"></select>
</li>
<li>
<label class="changeSize">送餐量:</label>
<input type="text" name="amDeliveryAmount" id="DeliveryAmount" class="form-control" value="${amDeliveryAmount }"/>
</li>
<li>
<label class="changeSize">上班时间:</label>
<input type="text" name="amStartTime" id="startTime" class="form-control" value="${amStartTime==null?'10:30':amStartTime }"/>
</li>
<li>
<label class="changeSize">下班时间:</label>
<input type="text" name="amEndTime" id="endTime" class="form-control" value="${amEndTime==null?'13:30':amEndTime }" />
</li>
<li>
<label>现金:</label>
<input type="text" name="amCash" id="Cash" value="${amCash}" class="form-control"/>
</li>
<li>
<label>奖金:</label>
<input type="text" name="amAward" id="Award" value="${amAward}" class="form-control"/>
</li>
<li>
<label>扣除:</label>
<input type="text" name="amDeduct" id="Deduct" value="${amDeduct}" class="form-control"/>
</li>
<li>
<label>备注:</label>
<textarea name="amRemark" id="remark"class="form-control">${amRemark }</textarea>
</li>
<li>
<input type="submit" id="submit" value="提交" />
</li>
</ul>