EasyUI的from表单,根据皮肤变换 改变表单颜色
先上效果图吧:
表单代码:
<style type="text/css">
#myResume{
border-collapse: collapse; /* 让边框合并 */
border: 1px solid #95B8E7; /*边框1个像素 */
}
/**改变th的字体*/
th{font-weight: normal;color: #0E2D5F;height:20px; line-height: 20px;width:80px;text-align:center}
td{padding:2px;}
#myResume input{width:180px;}
.resumeTable{width:98%}
</style>
<div class="demo-info">
<div class="demo-tip icon-tip"></div>
<div>注意: 录入个人简历</div>
</div>
<div style="position:relative;margin-left:40px;margin-top:10px;">
<form id="resumeForm" method="post">
<table id="myResume" bordercolordark="#FFFFFF" bordercolorlight="#45b97c" border="1px" cellpadding="0" cellspacing="0" >
<tr><th class="panel-header">姓 名</th ><td><input type="text" class="combo easyui-validatebox" data-options="required:true" name="name" style="height:27px;" /></td> <th class="panel-header">性 别</th><td><select class="easyui-combobox" data-options="panelHeight: 'auto'" name="sex" style="width:180px;"> <option value="男">男</option> <option value="女">女</option></select> </td></tr>
<tr><th class="panel-header">手机号码</th><td><input type="text" class="combo easyui-validatebox" data-options="required:true" name="name" style="height:27px;" /></td> <th class="panel-header">电子邮箱</th><td><input type="text" class="combo easyui-validatebox" data-options="required:true" name="name" style="height:27px;" /></td></tr>
<tr><th class="panel-header">教育程度</th><td><input type="text" class="combo easyui-validatebox" data-options="required:true" name="name" style="height:27px;" /></td> <th class="panel-header">工作职位</th><td><input type="text" class="combo easyui-validatebox" data-options="required:true" name="name" style="height:27px;" /></td></tr>
<tr><th class="panel-header">工作城市</th><td><input type="text" class="combo easyui-validatebox" data-options="required:true" name="name" style="height:27px;" /></td> <th class="panel-header">期望工资</th><td><input type="text" class="combo easyui-validatebox" data-options="required:true" name="name" style="height:27px;" /></td></tr>
<tr><th class="panel-header">自我介绍</th><td colspan="3"><textarea class="combo resumeTable"></textarea></td> </tr>
<tr><th class="panel-header">特长</th><td colspan="3"><textarea class="combo resumeTable"></textarea> </td> </tr>
<tr><th class="panel-header">地址</th><td colspan="3"><textarea class="combo resumeTable"></textarea></td> </tr>
</table>
</form>
</div>