關(guān)于bootstrap一直有爭議:
好吧其實不是爭議,就是前端從業(yè)者單方面的瞧不起它,自帶的css模板多爾過于簡單,傻瓜式操作,并不能滿足現(xiàn)在網(wǎng)站或者軟件的需求。
今天第一次試了試,發(fā)現(xiàn)有利有弊吧。也不是說把css簡單化了就一定神功夫。
比如,我今天接了小項目,是做一個很簡單的填資料的頁面(反正就很簡單)時間也給的充足,然后我一想我居然沒用過bs,這不應(yīng)該啊,所以就開始了磕磕絆絆的bs教程之路。
我的目標(biāo)是這樣的,使用bs的自帶css做個表單提交。表單是多行多列的。
而bs的官方教程里只有水平和列分開的實例。
可這又怎么能難得住少女我呢?直接用form-group和div class="container" div class="row"嵌套組合啊!妥妥的列行分明。
要是不用bs,其實可以用float浮動加table來實現(xiàn)。
可是table都被人家罵道不行了,我也還是克制一下隨大流。
啊,我的名字是從眾啊~
<form action="get" class="form-horizontal" role="form">
<fieldset>
<div id="legend" class="" >
<legend class="" align="center" style="height: 66px;font-size 22pt;line-height: 66px">學(xué)員檔案登記</legend>
</div>
<div class="container">
<div class="row">
<div class="col-sm-11">
<div class="form-group ">
<lable class="col-sm-1 control-lable" for="danhao">登記單號</lable>
<div class="col-sm-2">
<input class="form-control" id="danhao" type="text" />
</div>
<lable class="col-sm-1 control-lable" for="dengjiren">登記人</lable>
<div class="col-sm-2">
<input class="form-control" id="dengjiren" type="text" /></div>
<lable class="col-sm-1 control-lable" for="shijian">登記時間</lable>
<div class="col-sm-2">
<input class="form-control" id="shijian" type="date" />
</div>
</div>