前台页面布局显示用div分成
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>蓝光天娇城统计信息</title>
<link rel="stylesheet" type="text/css" href="css/Information.css">
<script type="text/javascript" src="js/jquery-1.4.min.js"></script>
<script type="text/javascript" src="js/Information.js"></script>
</head>
<body>
<div>
<div>
<label class='title'>蓝光天娇城统计信息</label>
</div>
<!-- 楼栋 -->
<div>
<div class = 'label'>楼栋:</div>
<select id="Building_ID" class='Building_Class odd'>
<option>请选择楼栋</option>
<option value="1#" text='1#'>1#</option>
<option value="2#" text='2#'>2#</option>
<option value="3#" text='3#'>3#</option>
<option value="商铺" text='商铺'>商铺</option>
</select>
<div class= 'xinghao'>*(必填)</div>
</div>
<!-- 房号 -->
<div>
<div class = 'label'>房号:</div>
<input id="roomNumber_ID" class='roomNumber_Class even' placeholder = '请输入房号'></input>
<div class= 'xinghao'>*(必填)</div>
</div>
<!-- 性质 -->
<div>
<div class = 'label'>性质:</div>
<select id="type_ID" class='type_Class odd'>
<option>请选择房子性质</option>
<option value="商铺" text='商铺'>商铺</option>
<option value="住宅" text='住宅'>住宅</option>
</select>
<div class= 'xinghao'>*(必填)</div>
</div>
<!-- 面积 -->
<div>
<div class = 'label'>面积:</div>
<input id="area_ID" class='area_Class even' placeholder = '请输入面积'></input>
<div class= 'xinghao'>*(必填)</div>
</div>
<!-- 中介费用 -->
<div>
<div class = 'label'>中介费用:</div>
<input id="zhongjie_ID" class='zhongjie_Class odd' placeholder = '请输入中介费用'></input>
<div class= 'xinghao nowork'>*</div>
</div>
<!-- 是否精装 -->
<div>
<div class = 'label'>是否精装:</div>
<select id="jingzhuang_ID" class='jingzhuang_Class even'>
<option>请选择房子是否精装</option>
<option value="是" text='是'>是</option>
<option value="否" text='否'>否</option>
</select>
<div class= 'xinghao'>*(必填)</div>
</div>
<!-- 网签日期 -->
<div>
<div class = 'label'>网签日期:</div>
<input id="wangqian_ID" class='wangqian_Class odd' placeholder = '请输入网签日期(如：2019-10-01)'></input>
<div class= 'xinghao nowork'>*</div>
</div>
<!-- 是否预告登记 -->
<div>
<div class = 'label'>预告登记:</div>
<select id="yugao_ID" class='yugao_Class even'>
<option>请选择房子是否预告登记</option>
<option value="是" text='是'>是</option>
<option value="否" text='否'>否</option>
</select>
<div class= 'xinghao'>*(必填)</div>
</div>
<!-- 付款账号(是否是合同上的监管账号) -->
<div>
<div class = 'label'>付款账号:</div>
<select id="fukuang_ID" class='fukuang_Class odd'>
<option>资金是否进入监管账号（合同上有）</option>
<option value="是" text='是'>是</option>
<option value="否" text='否'>否</option>
<option value="不知道" text='不知道'>不知道</option>
</select>
<div class= 'xinghao'>*(必填)</div>
</div>
<!-- 愿意要（房/钱）-->
<div>
<div class = 'label'>愿意要:</div>
<select id="yuanyiyao_ID" class='yuanyiyao_Class even'>
<option>愿意要（房/钱）</option>
<option value="房" text='房'>房</option>
<option value="钱" text='钱'>钱</option>
</select>
<div class= 'xinghao'>*(必填)</div>
</div>
<!-- 所在城市 -->
<div>
<div class = 'label'>所在城市:</div>
<select id="city_ID" class='city_Class odd'>
<option>所在城市</option>
<option value="昆明" text='昆明'>昆明</option>
<option value="地州" text='地州'>地州</option>
<option value="省外" text='地州'>省外</option>
</select>
<div class= 'xinghao'>*(必填)</div>
</div>
<!-- 年龄段 -->
<div>
<div class = 'label'>年龄段:</div>
<select id="old_ID" class='old_Class even'>
<option>请选择年龄段</option>
<option value="青（20-40）" text='青（20-40）'>青（20-40）</option>
<option value="中（40-60）" text='中（40-60）'>中（40-60）</option>
<option value="老（60以上）" text='老（60以上）'>老（60以上）</option>
</select>
<div class= 'xinghao'>*(必填)</div>
</div>
<!-- 选择参与过的活动 -->
<!--
<div class = 'label'>活动:</div>
<div class='Checkbox odd'>
<div >
<div id="c_active1" class='checkbox_div'><input type="Checkbox" id="active1" class='active' name="active1" value="530活动" onclick="selectCheckbox(this,'c_active1')">530活动</div>
<div id="c_active2" class='checkbox_div'><input type="Checkbox" id="active2" class='active' name="active2" value="630活动" onclick="selectCheckbox(this,'c_active2')">630活动</div>
</div>
</div>
-->
<!-- 可以参加的维权方式 -->
<div>
<div class = 'label '>维权方式:</div>
<div class='Checkbox odd'>
<div >
<div id="c_shangfang1" class='checkbox_div'><input type="Checkbox" id="shangfang1" class='shangfang' name="shangfang1" value="线上" onclick="selectCheckbox(this,'c_shangfang1')">线上</div>
<div id="c_shangfang2" class='checkbox_div'><input type="Checkbox" id="shangfang2" class='shangfang' name="shangfang2" value="线下" onclick="selectCheckbox(this,'c_shangfang2')">线下</div>
<div id="c_shangfang3" class='checkbox_div'><input type="Checkbox" id="shangfang3" class='shangfang' name="shangfang3" value="诉讼" onclick="selectCheckbox(this,'c_shangfang3')">诉讼</div>
</div>
</div>
<div class= 'xinghao nowork'>*</div>
</div>
<!-- 所在群 -->
<div>
<div class = 'label'>所在群:</div>
<div class='Checkbox even'>
<div >
<div id="c_qun1" class='checkbox_div'><input type="Checkbox" id="qun1" class='qun' name="qun1" value="小余" onclick="selectCheckbox(this,'c_qun1')">小余</div>
<div id="c_qun2" class='checkbox_div'><input type="Checkbox" id="qun2" class='qun' name="qun2" value="小猫" onclick="selectCheckbox(this,'c_qun2')">小猫</div>
<div id="c_qun3" class='checkbox_div'><input type="Checkbox" id="qun3" class='qun' name="qun3" value="无" onclick="selectCheckbox(this,'c_qun3')">无</div>
</div>
</div>
<div class= 'xinghao nowork'>*</div>
</div>
<!-- 付款方式 -->
<div>
<div class = 'label'>付款方式</div>
<select id="paymentmethod_ID" class='paymentmethod_Class odd'>
<option>选择付款方式</option>
<option value="全款" text='全款'>全款</option>
<option value="贷款" text='贷款'>贷款</option>
</select>
<div class= 'xinghao'>*(必填)</div>
</div>
<!-- 备注 -->
<div>
<div class = 'label'>备注:</div>
<input id="remarks_ID" class='remarks_Class even' placeholder = '备注'></input>
<div class= 'xinghao nowork'>*</div>
</div>
<div>
<input id="submitbutton" class='submitbutton' type = 'button' value = '提交'></input>
</div>
</div>
</body>
</html>结果展示：
