表格（房源详情表）
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>表格和表单</title><style>thead {background-color: chartreuse;}tbody {background-color: yellow;}tfoot {background-color: gainsboro;}</style></head><body><!-- 表格 --><table border="1" cellspacing="0" cellpading="8" width="600px"><!-- 标题 --><caption>房源详情表</caption><!-- 表头 --><thead><tr><th colspan="2">房源编号：</th><td colspan="2">HS20200731</td></tr></thead><!-- 主体 --><tbody><tr><th colspan="2">房源标题：</th><td colspan="2">独家房源！仅此一套！错过了就没有了</td></tr><tr><th>户型：</th><td>三室一厅</td><th rowspan="2">面积：</th><td rowspan="2">120平方米</td></tr><tr><th>年代：</th><td>2010年</td></tr><tr><th>装修：</th><td>豪华装修</td><th>佣金：</th><td>5%</td></tr><tr><th>业主：</th><td colspan="3">张三，联系方式18866667777</td></tr></tbody><!-- 底部 --><tfoot><tr><th>房源描述</th><td colspan="3">南北通透，全天采光好，透气好，地理位置优越，配套设施一应俱全</td></tr></tfoot></table></body></html>
运行结果
表单（用户注册表单）
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>表单</title></head><body><h2>用户注册表</h2><form action=""><div><label for="username">用户名：</label><inputid="username"type="text"name="username"value=""placeholder="请输入用户名"requiredautofocus/></div><div><label for="password">密码：</label><inputtype="password"id="password"name="password"value=""placeholder="密码不少于8位字符"required/></div><div><label for="secret">性别：</label><input type="radio" name="sex" id="nan" /><label for="nan">男</label><input type="radio" name="sex" id="nv" /><label for="nv">女</label><input type="radio" name="sex" id="secret" /><label for="secret">保密</label></div><div><label for="">爱好</label><input type="checkbox" name="hobby[]" id="code" /><label for="code">敲代码</label><input type="checkbox" name="hobby[]" id="game" /><label for="game">打游戏</label><input type="checkbox" name="hobby[]" id="run" /><label for="run">跑步</label><input type="checkbox" name="hobby[]" id="music" /><label for="music">听音乐</label></div><div><label for="user_img">头像：</label><input type="file" name="user_img" id="user_img" /><input type="hidden" name="MAX_FILE_SIZE" value="8388608" /><input type="hidden" name="user_id" value="1010" /></div><div><label for="my_course">课程：</label><input type="text" id="my_course" list="course" /><datalist id="course"><option value="html">html</option><option value="css">css</option><option value="javascript">javascript</option><option value="php">php</option><option value="java">java</option><option value="pathon">pathon</option></datalist></div><div><label for="email">邮箱：</label><input type="email" name="email" placeholder="demo@123.com" /></div><div><label for="btithday">生日：</label><input type="date" name="btithday" /></div><div><label for="age">年龄：</label><input id="age" type="number" name="age" min="18" max="50" /></div><div><label for="education">学历：</label><select name="edu" id=""><option value="">请选择学历</option><option value="gaozhong">高中</option><option value="dazhuang">大专</option><option value="benke">本科</option></select></div><hr /><button>提交</button></form></body></html>
运行结果
